我正在为我的客户开发一个网站,我遇到的问题是,每当您调整窗口大小时,导航栏上的按钮都会挤在一起。这个问题的原因对我来说并不明显,所以我来这里寻求帮助。当浏览器窗口最大化时,导航栏对我来说也很好,但对我的客户而言,她在页面中间看到了twitter按钮。我认为这只是分辨率问题,因为她的屏幕比我的屏幕小,但是有没有解决的方法?

网站:
the crue cart

的HTML
ojit_pre

的CSS

@font-face { font-family: chunkfive; src: url("fonts/Chunkfive.otf") format("opentype"); }

    <title>the crue cart</title>

    <link rel="shortcut icon" href="images/favicon.png">
    <link rel="alternate" type="application/rss+xml" href="{RSS}">
    <link rel="stylesheet" href="style.css" type="text/css" media="screen" />
    <script src="http://platform.twitter.com/anywhere.js?id=yQDKaggXesWYWPCPFNXn1Q&amp;v=1">
    </script>
    <script type="text/javascript">
        twttr.anywhere(function(twitter) {
            twitter.hovercards();
        });
    </script>



</head>
<body>

    <div id="container">

        <div id="header">
            <ul>
                <li><div id="logo">
                    <h1 class="thecruecart">the crue cart
                    <img src="images/leaf.png" width="15" height="15" class="leaf"></h1>
                    <h1 class="wholesnackerie">whole snackerie<h1>
                </div></li>
                <!--Who What When Where Why Help!-->
                <li class="navigation"><a href="home.html" class="navigation">Who<span class="green">?</span></a></li>
                <li class="navigation"><a href="thewhat.html" class="navigation">What<span class="green">?</span></a></li>
                <li class="navigation"><a href="thewhenwhere.html" class="navigation">When & Where<span class="green">?</span></a></li>
                <li class="navigation"><a href="thewhy.html" class="navigation">Why<span class="green">?</span></a></li>
                <li class="navigation"><a href="help.html" class="navigation">Help<span class="green">!</span></a></li>
                <li class="navigation"><a href="order.html" class="navigation">ORDER<span class="green">!</span></a></li>
                <li class="navigation"><div id="share">
                <iframe src="http://www.facebook.com/plugins/like.php?href=facebook.com%2Fthecruecart&amp;layout=button_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:75px; height:21px;" allowTransparency="true"></iframe>
                <a href="http://twitter.com/share" class="twitter-share-button" data-url="http://www.twitter.com/thecruecart" data-text="Check out The Crue Cart!" data-count="horizontal">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
                </div></li>
            </ul>
        </div>

        <div id="navbar"></div>

        <div id="title">
            <h2 class="title">Catering? Hungry?</h2>
        </div>

        <div id="body">
            <p>The Crue Cart is a mobile bakery that finds its home in Bellevue. We love animals and nutrition, and our cupcakes show that.<br/> No wheat, no animal products (or by-products) and no processed sugar. Also, our products will be organic and locally produced<br/> whenever possible. We love supporting local agriculture and economy.</p>
            <br/>
            <p>Want to chat? <span class="chunky">Email us: hello@thecruecart.com</span></p>
        </div>

        <div class="clearfooter"></div>
    </div>

    <div id="footer">
        <p class="ft">&copy the crue cart 2010. All Rights Reserved.</p>
    </div>
</body>

最佳答案

问题是,您没有宽度为100%的固定宽度容器,该位置是液体。

您需要在容器上设置一个宽度,它将很好玩!

09-10 08:42
查看更多