[HTML/CSS] Wer kann mir erklären wie ich diese Tabelle dynamisch bekomme?

[BartTheDevil89]

Hallo,

ich beschäftige mich im Moment auch etwas mit Grafik und habe mir jetzt folgende Tabelle erstellt:

https://www.liamus.de/test/menu1.html

Dort ist ja in der Mitte die Grafik _03 und dort soll später Text reingeschrieben werden.

Jetzt ist aber die Frage, wie ich es schaffe, dass sich diese Box verlängert, verkürzt, je nachdem wieviel Content drinsteht.

Ich denke mal, dass ich dabei doch nur die Grafik links und rechts vom Content und eben den contentbereich selbst bearbeiten muss. Ich hab es schon versucht mit background=... aber leider bekomm ich es so nicht hin, da verzieht sich nur alles.

Kann mir eventuell mal jemand erklären, wie ich so eine einfache Box dynamisch hinbekomme? Denn das war für mich immer schon ein Rätsel!

Dankeschön

 

[freefly]

Du brauchst nur den oberen Teil als konkrete Grafik. Der Rest läßt sich mit simplen HTML machen. Mit dynamischen Quellcode bist Du hier im Grafikforum deshalb auch falsch und der Thread passt eher in das Coderforum.

 

[mydoys.de]

Etwa so geht das:

<table id="Tabelle_01" width="150" height="150" border="0" cellpadding="0" cellspacing="0">
	<tr>
		<td colspan="3">
			<img src="Bilder/menu1_01.gif" width="150" height="28" alt=""></td>
	</tr>

	<tr>
		<td rowspan="2">
			<img src="Bilder/menu1_02.gif" width="20" height="122" alt=""></td>
<td background="Bilder/menu1_03.gif" width="122" height="116" valign="top">
Soll hier dein Text Rein?
</td>
		<td rowspan="2">
			<img src="Bilder/menu1_04.gif" width="8" height="122" alt=""></td>
	</tr>
	<tr>

		<td>
			<img src="Bilder/menu1_05.gif" width="122" height="6" alt=""></td>
	</tr>
</table>

 

[BartTheDevil89]

Etwa so geht das:

<table id="Tabelle_01" width="150" height="150" border="0" cellpadding="0" cellspacing="0">
	<tr>
		<td colspan="3">
			<img src="Bilder/menu1_01.gif" width="150" height="28" alt=""></td>
	</tr>

	<tr>
		<td rowspan="2">
			<img src="Bilder/menu1_02.gif" width="20" height="122" alt=""></td>
<td background="Bilder/menu1_03.gif" width="122" height="116" valign="top">
Soll hier dein Text Rein?
</td>
		<td rowspan="2">
			<img src="Bilder/menu1_04.gif" width="8" height="122" alt=""></td>
	</tr>
	<tr>

		<td>
			<img src="Bilder/menu1_05.gif" width="122" height="6" alt=""></td>
	</tr>
</table>

Eben nicht...denn dann kommt das bei raus, wenn der Content mehr wird. (siehe Link)

 

[mydoys.de]

Eben nicht...denn dann kommt das bei raus, wenn der Content mehr wird. (siehe Link)

Dann eben so

<table id="Tabelle_01" width="150" height="150" border="0" cellpadding="0" cellspacing="0">
	<tr>
		<td colspan="3">
			<img src="Bilder/menu1_01.gif" width="150" height="28" alt=""></td>
	</tr>

	<tr>
		<td rowspan="2" background="Bilder/menu1_02.gif" width="20" height="122"></td>
<td background="Bilder/menu1_03.gif" width="122" height="116" valign="top">
Soll hier dein Text Rein?
</td>
		<td rowspan="2" background="Bilder/menu1_04.gif" width="8" height="122"></td>
	</tr>
	<tr>

		<td>
			<img src="Bilder/menu1_05.gif" width="122" height="6" alt=""></td>
	</tr>
</table>

 

[freefly]

Ich frag mich halt nur gerade was an HTML Code dynamisch sein soll? Aber naja - ich hab ja keine Ahnung

 

[topfkanne]

mach das mit DIVs und css

dann geht das circa so (wenn man keine externe css included..)

<div style="background:url(link/zur/mitte.gif) repeat-y;width:112px">

<div style="background:url(link/zur/oberen_grafik.gif) top no-repeat">

<div style="background:url(link/zur/unteren_grafik.gif) bottom no-repeat;padding:33px 13px 0 25px">

Dein Inhalt
<br/><br/>
und so weiter

</div>

</div>

</div>

sollte so gehen *g
geht bestimmt auch eleganter, aber will dir jetzt nur mal beispiel zeigen

die mittlere grafik muss von links nach rechts durchgehen (also 150px) und braucht nur 1px hoch zu sein. sie wird sozusagen nach unten beliebig oft neu eingefügt und ergibt so deinen hintergrund

 

[maya]

Warum macht ihr euch die Arbeit mit den Bildern?
bgcolor=#xxxxxx und gut is. Ist ja schließlich keine Struktur drin, sondern nur ein Farbton.
Je mehr Bilder ein Layout hat umso mehr muss geladen werden.

Die einzige Grafik, die ich an dem Menü verwenden würde ist diese:

 

[freefly]

Warum macht ihr euch die Arbeit mit den Bildern?

Meine Rede...

 

[Liquid0815]

kann ich nur zustimmen, je weniger grafiken, desto schnellere ladezeiten.

 

[BartTheDevil89]

kann ich nur zustimmen, je weniger grafiken, desto schnellere ladezeiten.

Meine Rede...

Ah, auf die Idee bin ich garnicht gekommen^^.......

Dankeschön, jetzt gehts

 

[topfkanne]

hmmm weil ich die bilder bei ihm gesehen habe