Internet explorer css problem. (Hidden padding)
I have created a little slider using jQuery UI, and it's works fantastically in Firefox, exactly as it should. However, in IE, it seems to put padding in between objects. Take a look and you'll see开发者_JAVA技巧:
http://www.grant[deletethis]unwin.co.uk/slider/slider1.html
I understand that different broswers have different page margins and paddings set automatically, so I tried to use:
* {
padding: 0px;
margin: 0px;
}
But the problem persists.
The Question:
how can I eliminate the gaps between the pictures on my slider (In IE)?
Your page is rendering in Quirks Mode, because you aren't using a doctype (..that will trigger Standards Mode).
Your first line is currently this:
<html>
Add a doctype as the very first line, such as the HTML5 doctype:
<!DOCTYPE html>
It will be magically fixed.
Please add a valid Doctype because your website is being viewed in Quirks mode in IE.
<!DOCTYPE html>
<html> .... </html>
Additionaly
Remove float for the img element itself and set display: block;
.scroller_item {
float: left;
height: 238px;
width: 192px;
}
.scroller_item .image {
display: block;
height: 238px;
width: 192px;
}
I suggest using a reset to put all the styles back to zero in all browsers. Using that should fix your problem. Eric Meyer's Reset
Try adding:
*
{
padding: 0px;
margin: 0px;
border: none;
}
#sliding_section
{
overflow: auto;
}
You'll have to tweak the * properties, as this will be bad for a production site, but it might work.
Try removing the "float:left" in your ".scroller_item .image" definition in your CSS class.
加载中,请稍侯......
精彩评论