0

I am developing on a 1280px wide screen and although the pics that I'm displaying only add up to 1264px the last one is not displaying inline and instead is being put in a new line.

<!DOCTYPE html>
<html>
    <head>
        <title>My Title</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link rel="stylesheet" type="text/css" href="CSS/indexCSS.css">
    </head>
    <body>
        <div class="topPics">            
            <ul>
                <li>
                    <a href="">
                        <img src="images/santa.jpg"/>
                    </a>
                </li>                
                <li>
                    <a href="">
                        <img src="images/eyes.jpg"/>
                    </a>
                </li>
                <li>
                    <a href="">
                        <img src="images/ladyBlue.jpg"/>            
                    </a>
                </li>
                <li>
                    <a href="">
                        <img src="images/andy.jpg"/>
                    </a>
                </li>
            </ul>                        
        </div>
        <div class="logo">
            <span style="font-size: 30px; color: #fff; font-family: cursive;"> TEXT</span>
            <span style="color: #999"> |  TEXT</span>
        </div>
    </body>
</html>

CSS

    root { 
        display: block;
    }

    body{
        background: #0f0f0f;     
        width: 100%;
        height: 100%;
    }

    ul{     
        overflow: hidden;
    }

    li{    
        margin: 0px;
        float: left;
        height: 100%; 

    }

    .topPics{
        overflow: hidden;
        height: 100%; 
        width: 100%; 

    }

    .logo{
         margin-top: 10px;
         margin-bottom: 10px; 
         margin-left: 40px; 
         width: 100%
    }

Can anyone see whats wrong with this?

4

3 に答える 3

0

画面は 1280 ピクセルかもしれませんが、そのスペースの一部はブラウザーの境界線とスクロール バーによって占められているため、描画する 1280 ピクセルがありません。効果を確認するには、topPics で width:1280px を設定してみてください。

于 2013-10-16T20:42:05.197 に答える