0

#top_menu という div を中央に配置したい 

<div id="top_menu">This is the menu and it is in the middle of the page</div>

CSS コード: 

#top_menu { margin: 0 auto; width: 600px; ... }

トップメニューの左側にロゴ (#logo) を表示する必要があります

これは私がこれまでに持っているものです:

#logo { position: absolute; top: 0px; left: 10px; width: 200px }

今問題が来る

800px より小さいブラウザ ウィンドウを使用している場合、中央の div がロゴ div をオーバーレイします。代わりにスクロールバーがあればいいですね。どうすればいいですか？

前もって感謝します！フレディ

4

3 に答える 3

1

これを試してください（cssで）：

#top_menu { overflow: auto; }

もちろん、div タグ内にロゴ タグを含める必要があります。

于 2011-03-11T16:31:56.223 に答える
1

とった：

#logo
{
    float: left;
}

と

#top_menu
{
    margin: 20px auto 0;
    height:29px;
    width: 602px;
}

HTML

<div id="logo"><img src="<?=site_url('img/logo.jpg')?>" /></div>

        <div id="top_menu">



            <ul id="top_links">
                <li><a href="<?=site_url()?>">Startseite</a></li>
                <li><a href="<?=site_url('static/impressum')?>">Impressum</a></li>
            </ul>
        </div>
于 2011-03-11T17:41:42.550 に答える
1

これを行う、

#top_menu{
    width:800px;
    margin:0 auto; 
    border:1px solid red;
    display:block;
}

#logo { 
    float:left;
    width: 200px;
    height:50px;
    background:white url(logo.png) no-repeat 0 0
}

これで、ウィンドウ サイズが小さい場合に div がオーバーラップしなくなりました。

http://jsfiddle.net/WV8q7/3/で実際の例を確認してください

于 2011-03-11T16:55:05.527 に答える