Bin leider Anfänger mit XHTML und CSS und habe ein Problem. Ich will meine bereits bestehende Internetplattform
http://www.pferdeverkauf.com in XHTML mit CSS umprogrammieren.
Da ich im einen oder anderen Div mehr oder weniger Text habe, benötige ich die Funktion, dass die 3 verschiedenen Div's im Container immer die selbe Höhe haben und dadurch parallel unten abschließen. Im IE funzt es im Firefox nicht. Desweiteren steht der Text nicht im Div warum?
Testseite ist einzusehen unter:
http://hunter-horses.com/test-9.html
Bin um jeden Tip dankbar!
Code:
* {
margin: 0;
padding: 0;
border: 0;
}
html,body {
text-align:center;
background-color: #373733;
height: 100%;
}
#header{
margin: 20px auto 0 auto;
width: 795px;
height: 80px;
background-image: url(2004-hint-o-lr.gif);
background-repeat: repeat-x;
background-color: #FAAE53;
border-left: 1px solid Black;
border-right: 1px solid Black;
}
#container{
width:795px;
height: 100%;
margin: 0 auto 0 auto;
background-color: #FAAE53;
border-left: 1px solid Black;
border-right: 1px solid Black;
border-bottom: 1px solid #FAAE53;
padding-left: 5px 0 0 0;
}
* html div#container {
min-height:100%;
}
#navigation{
width:145px;
float: left;
background-color: #FCD09A;
border: 1px solid Black;
display: run-in;
overflow: inherit;
}
* html div#navigation {
min-height:100%;
}
#content{
width:500px;
float:left;
background-color: #FDE1C0;
height:100%;
border-top: 1px solid Black;
border-right: 1px solid Black;
border-bottom: 1px solid Black;
}
* html div#content {
min-height:100%;
}
#holder {
width:5px;
height: 100%;
float:left;
}
#sub-content{
width:130px;
float:left;
background-color: #FCD09A;
border-left: 1px solid Black;
border-right: 1px solid Black;
border-top: 1px solid Black;
border-bottom: 1px solid Black;
height: 100%;
}
* html div#sub-content {
min-height:100%;
}
#footer {
margin: 0 auto;
background-color: #FAAE53;
border-left: 1px solid Black;
border-right: 1px solid Black;
border-bottom: 1px solid Black;
width: 795px;
position: static;
bottom: 0;
clear: both;
margin-top: -1px;
}
Code:
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<title>xxxxxxxxx</title>
<link rev="made" href="xxxxxxxxx" />
<link rev="start" href="test-9.html" title="Home Page" />
<meta name="keywords" content="xxxxxxxxx" />
<meta name="description" content="xxxxxxxxx" />
<link href="test-9.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="header">[img]pferdeverkauf.gif[/img]</div>
<div id="container">
<div id="holder"></div>
<div id="navigation">Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -</div>
<div id="content">dein content</div>
<div id="holder"></div>
<div id="sub-content">
Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -Test -</p>
</div>
<div id="holder"></div>
</div>
<div id="footer">footer</div>
</body>
</html>
[/url]