Divs Tabellenähnlich anordnen

Status
Nicht offen für weitere Antworten.

Zack

cookies vader
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
	<title>Test</title>


<style type="text/css">
CSS:
	*{
		padding:0;
		margin: 0;
	}

	html{
		background-color: #ccc;
	}

	div.clear {
	    clear: both;
	    margin: 0;
	    padding: 0;
	    height: 0;
	    line-height: 0;
	    font-size: 0;
	}

	div#centerwrap {
		float:left;
	  	width: 100%;
		margin: 0 -95% 0 0;
	}
		div#center {
			 min-height: 600px;
			 background-color: #ffffff;
			 margin: 0 170px 0 170px;
		}
			div#center_kante_oben{
				float:left;
				width:100%;
				height:20px;
				background-color:#00f;
			}

				div#center_kante_oben div#center_ecke_left{
					float:left;
					width:20px;
					height:20px;
					background-color:#0f0;
				}

				div#center_kante_oben div#center_ecke_right{
					float:right;
					width:20px;
					height:20px;
					background-color:#f00;
				}

			div#center_content{
				width:100%;
				height:100%;
				background-color:#fff;
			}
				div#center_left{
					float:left;
					width:20px;
					background-color:#f00;
				}

				div#center_center{
					margin:0 22px 0 22px;
					background-color:#f0f0f0;
				}

				div#center_right{
					float:right;
					width:20px;
					background-color:#0f0;
				}

			div#center_kante_unten{
				float:left;
				width:100%;
				height:20px;
				background-color:#00f;
			}

				div#center_kante_unten div#center_ecke_left{
					float:left;
					width:20px;
					height:20px;
					background-color:#0f0;
				}

				div#center_kante_unten div#center_ecke_right{
					float:right;
					width:20px;
					height:20px;
					background-color:#f00;
				}
HTML:
</style>
</head>
<body>
	<div id="centerwrap">
		<div id="center">
			<div id="center_kante_oben">
				<div id="center_ecke_left"></div>
				<div id="center_ecke_right"></div>
			</div>
			<div class="clear"></div>
			<div id="center_content">
				<div id="center_left"></div>
				<div id="center_right"></div>
				<div id="center_center">
					<table width="100%" border="1">
						<tr>
							<td>Test</td>
						</tr>
					</table>
				</div>
			</div>
			<div class="clear"></div>
			<div id="center_kante_unten">
				<div id="center_ecke_left"></div>
				<div id="center_ecke_right"></div>
			</div>
			<div class="clear"></div>
    	</div>
	</div>
</body>
</html>
<div id="center_left"> und <div id="center_right"> sollen sich nach der Höhe von <div id="center_center"> orientieren dabei aber dabei so wie es jetzt ist links und rechts davon sein.
How to do? Ich krieg es nicht hin das diese die selbe Höhe haben.
 
Hi,

der Diskussions-Artikel AnyColumnLongest führt eine Vielzahl an Links, die sich in der Vergangenheit mit der technischen Umsetzung solcher "Equal-Height-Columns" beschäftigt haben.

mfg Maik
 
Status
Nicht offen für weitere Antworten.
Zurück