开发者

Firefox CSS nowrap problem

开发者 https://www.devze.com 2023-02-13 14:14 出处:网络
I\'m trying to create a horizontal (no line breaks) unordered list of images on my website using code as follows:

I'm trying to create a horizontal (no line breaks) unordered list of images on my website using code as follows:

<ul class="ImageSet">
    <li>
        <img src="blah">
    </li>
    <li>
        <img src="blah">
    </li>
    <li>
        <img src="blah">
    </li>
</ul>

In my CSS, I'm using the following rules:

.ImageSet { white-space: nowrap; }
.ImageSet li { dis开发者_JAVA技巧play: inline; float: left; height: 100% }

This is working properly in Chrome, but not in Firefox, for some reason does anyone know why?

EDIT: To clarify, the problem in FF is that the li's still wrap. I'm trying to make them all appear in a single, unbroken horizontal line going off the rightmost edge of the page.


Try removing float:left as display:inline should suffice


When you float li's they will wrap when they reach the end of their parent container (which could be the body tag). If you are wanting the image to disappear out of the screen you will need to set the width of the parent container (the ul) and use overflow hidden or auto to get your desired effect.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号