0

私はこのHTMLを持っています:

<div class="parent">
   <div class="left"></div>
   <div class="center"></div>
   <div class="right"></div>
</div>

div.left にはいくつかのメニュー項目が含まれるため、その幅が変更されます div.right は left と同様になります (幅が変更されます)

div.center の幅は固定で、ロゴです。

div.parent 内で div.center を中央に配置したいので、

   div.center {margin: 0px auto;}

私にはうまくいきません。どうすればこれを行うことができますか

左の div の代わりに画像に style= の ul があります

左の div の代わりに図にあるのは、style="display: block" を使用した ul です。

実際のコードは次のとおりです。

div class="header">
<ul class="user-menu">
<li>
<li>
<li>
</ul>
<div class="user-name">
Привет,&nbsp;
<strong>Administrator</strong>
<a href="/User/LogOff">Выйти</a>
</div>
<a class="logo" href="/">
<img alt="Сайт барабанщиков Funky Drummer" src="/Content/themes/default/images/logo.png">
</a>
</div>

そしてそれのためのCSS：

/* Header */
div.main > div.header > ul.user-menu {position: absolute;max-width: 200px; float: left; overflow: hidden; list-style-type: none;padding: 0;margin-left: 2em;margin-top: 1em;font-family: Verdana;font-size: 11px;}
div.main > div.header > ul.user-menu a {color: #455369;}
div.main > div.header > ul.user-menu li {float: left; margin-right: 1em;}
div.main > div.header > div.user-name { margin-right: 2em;margin-top: 1em;float: right;font-family: Verdana;font-size: 11px;}
div.main > div.header {min-height: 177px;text-align: center;}
div.main > div.header > a.logo {overflow: hidden;width:250px;height:177px;}
4

2 に答える 2

0 
div.center { position: relative; left:50%;}

私はそれが仕事をするかもしれないと思います。

于 2012-05-12T09:44:23.340 に答える
0

これはおそらく、親 div の幅が可能な限り小さいためです。

代わりにこれを試してください：

<div class="parent" style="width: 100%;">
    <div class="left"></div>
    <div class="center" style="margin: 0px auto;"></div>
    <div class="right"></div>
</div>
于 2012-05-12T09:46:31.843 に答える