PDA

Click to See Complete Forum and Search --> : Set margin-left for container => its input display wrong

TaoDay
02-14-2007, 11:31 PM
Dear Friends!

I got a strange bug and I need your help.

My Trouble:Form's input element does not display close its label.
Bug Condition: IE 6.0
Try:

Render in Standards compliance mode of Strict DTD
Pass Css Validator
Pass Xhtml Validator


Bug's code:

Xhtml:

<body>

<div id="details">
<form method="post" action="this">
<div id="contentNameCont">
<label for="contentName">Content name:</label>
<input id="contentName" type="text" />
</div>

<div id="defaultCulturesCont">
<label for="defaultCulture">Default culture:</label>
<textarea id="defaultCulture" cols="6" rows="4"></textarea>
</div>
</form>
</div>

</body>

CSS:

div#details {
margin: 0% 0% 0% 40%;
background-color: yellow;
}

input,
label {
display: block;
float: left;
}

#details div {
overflow: auto;
width: 100%;
margin-bottom: 5px;
border: solid 1px black;
}



Thank for your help!
ray326
02-14-2007, 11:59 PM
In that pattern I do a text-align:right on the label. It also seems you need to give the labels and inputs a width or they'll be 100%.
TaoDay
02-15-2007, 01:31 AM
I did, but it is still not work.

input,
label {
display: block;
float: left;
width: 10em !important;
}
TaoDay
02-15-2007, 07:30 AM
I tried isolation code & problem.
You can easy find bug at Simplest code for "Set margin-left for container..." (http://www.webdeveloper.com/forum/showthread.php?p=714683#post714683).