w jaki sposob majac w pierwszym div'ie dwa inne div'y(te div'y wewnatrz sa pozycjonowane za pomoca float-rigth i left) wykonac automatyczne dopasowywanie wysokosci div'ow wewnetrznych.na razie w kodzie mam height podane przez wartosc px, a chce zeby wysokosc byla 'wyczuta' automatycznie.jak zapodam height: 100% to IE lyka, a np firefox juz ni.help.jest to zwiazane na pewno z float controlem.
kod css:
Kod
body {
background-color:#97ACC2;
}
body,p,input {
margin:0px;
padding:0px;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:11px;
color:#000;
}
input {
border:1px solid gray;
height:12px;
}
p.header {
color:#fff;
text-align:center;
}
p.msgred {
color:#C0003F;
}
p.incol {
padding: 5px 0px 0px 0px;
}
p.incolright {
padding: 5px 0px 0px 0px;
text-align:right;
}
input.text250 {
padding:0px;
width:250px;
}
input.button70 {
border:1px solid gray;
width:70px;
height:16px;
cursor:hand;
}
#floatleft {
float:left;
padding:10px 0px 0px 10px;
}
#floatright {
float:right;
padding:10px 10px 0px 0px;
}
#padding10 {
padding:10px;
}
#header {
padding:2px 0px 2px 0px;
margin:0px;
width:360px;
background-color:#003E7C;
}
#container01 {
margin-top:20%;
margin-left:auto;
margin-right:auto;
padding:0px;
width:360px;
height:95px;
background-color:#fff;
border-top:2px solid white;
border-left:2px solid white;
border-bottom:2px solid black;
border-right:2px solid black;
}
#container02 {
margin-top:10px;
margin-left:auto;
margin-right:auto;
padding:0px;
width:360px;
height:50px;
background-color:#fff;
border-top:2px solid white;
border-left:2px solid white;
border-bottom:2px solid black;
border-right:2px solid black;
}
background-color:#97ACC2;
}
body,p,input {
margin:0px;
padding:0px;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:11px;
color:#000;
}
input {
border:1px solid gray;
height:12px;
}
p.header {
color:#fff;
text-align:center;
}
p.msgred {
color:#C0003F;
}
p.incol {
padding: 5px 0px 0px 0px;
}
p.incolright {
padding: 5px 0px 0px 0px;
text-align:right;
}
input.text250 {
padding:0px;
width:250px;
}
input.button70 {
border:1px solid gray;
width:70px;
height:16px;
cursor:hand;
}
#floatleft {
float:left;
padding:10px 0px 0px 10px;
}
#floatright {
float:right;
padding:10px 10px 0px 0px;
}
#padding10 {
padding:10px;
}
#header {
padding:2px 0px 2px 0px;
margin:0px;
width:360px;
background-color:#003E7C;
}
#container01 {
margin-top:20%;
margin-left:auto;
margin-right:auto;
padding:0px;
width:360px;
height:95px;
background-color:#fff;
border-top:2px solid white;
border-left:2px solid white;
border-bottom:2px solid black;
border-right:2px solid black;
}
#container02 {
margin-top:10px;
margin-left:auto;
margin-right:auto;
padding:0px;
width:360px;
height:50px;
background-color:#fff;
border-top:2px solid white;
border-left:2px solid white;
border-bottom:2px solid black;
border-right:2px solid black;
}
kod xhtml:
Kod
<div id="container01">
<div id="header">
<p class="header">Login page</p>
</div>
<div id="floatleft">
<p class="incol">Login:</p>
<p class="incol">Password:</p>
</div>
<div id="floatright">
<form action="index.php?pg=login" method="post">
<p class="incol"><input name="aFields[login]" class="text250" /></p>
<p class="incol"><input name="aFields[password]" type="password" class="text250" /></p>
<p class="incolright"><input name="aFields[submit]" type="submit" class="button70" value="Login" /></p>
</form>
</div>
</div>
{if $userLoggedIn == "FALSE" }
<div id="container02">
<div id="header">
<p class="header">Login incorrect</p>
</div>
<div id="padding10">
<p class="msgred">Your login and/or password are incorrect</p>
</div>
</div>
{/if}
<div id="header">
<p class="header">Login page</p>
</div>
<div id="floatleft">
<p class="incol">Login:</p>
<p class="incol">Password:</p>
</div>
<div id="floatright">
<form action="index.php?pg=login" method="post">
<p class="incol"><input name="aFields[login]" class="text250" /></p>
<p class="incol"><input name="aFields[password]" type="password" class="text250" /></p>
<p class="incolright"><input name="aFields[submit]" type="submit" class="button70" value="Login" /></p>
</form>
</div>
</div>
{if $userLoggedIn == "FALSE" }
<div id="container02">
<div id="header">
<p class="header">Login incorrect</p>
</div>
<div id="padding10">
<p class="msgred">Your login and/or password are incorrect</p>
</div>
</div>
{/if}