0

.headlineの幅を設定せずに、divの見出しを中央に配置し、その長さを内部のテキスト（私のタイトル）と同じ幅に保つにはどうすればよいですか。

<div class="sidebar">

    <div class="headline"><p>My title</p></div>

</div>

現在、このcssを使用していますが、「私のタイトル」はphpによって生成され、長さが異なります。

.headline {
    width: 5em;
    background: #900;
    color: #FFF;
    text-align: center;
    text-transform: uppercase;
    line-height: 2em;
    border: solid 1px #555;
    border-top: none;
    padding: 0;
    margin: 0 auto
}

ありがとうございました

4

2 に答える 2

1 
.sidebar {
  text-align: center;
}
.headline {
  display: inline-block;
}
于 2012-09-04T07:38:16.733 に答える
0

このように書いてください：

.sidebar{
 text-align:center;
}
.headline {
    background: #900;
    color: #FFF;
    text-align: center;
    text-transform: uppercase;
    line-height: 2em;
    border: solid 1px #555;
    border-top: none;
    padding: 0;
    display:inline-block;
    *display:inline; /*For IE7*/
    *zoom:1; /*For IE7*/
}
于 2012-09-04T07:38:52.607 に答える