submit button and display block in IE
why does the code below开发者_如何学JAVA put the submit button on its own line in FF but on the same line in IE?
<style type="text/css">
#div1 form input.submit {display:block;}
</style>
<div id="div1">
<form>
hi
<input type="submit" class="submit" value="hello there">
</form>
</div>
The reason this happens is because you are missing a <body> open tag. When the <body> open tag is not explicitly in the HTML, IE (6 at least ) misrenders the document tree and any selectors involving form elements don't work properly.
Here, I added the body tag and it works.
Just yesterday I documented pretty much the same bug. It looks like I'll have to update the description to account for not only the form being unstylable with the body tag missing, but other elements unstylable if its in the selector.
And as doctororange points out, you can workaround this by not specifying form in the selector as well, but I advise you to throw in the <body> tag.
If you are testing on ie6 try:
#div1 form .submit {display:block;}
Because IE doesn't conform to web standards.
It looks to me as though the form selector is getting in the way, at least with the tripply nested selector:
This works:
#div1 input.submit{
display:block;
}
This works:
form input.submit{
display:block;
}
This doesn't:
#div1 form input.submit{
display:block;
}
加载中,请稍侯......
精彩评论