CSS中心テキスト

黄色いバーは、私はいつもどんなに側のテキストの長さを中央に配置するMAIN TEXTを達成したいと思いますwidth:100%ヘッダCSS中心テキスト

です。事前に

enter image description here

おかげ

EDIT：これまでのHTMLとCSS：

HTML：

<html> 
    <head> 
    </head> 
    <body> 
    <center> 
    <div id="top"></div> 
    Text Logo 
    <span id="mainText"> Menu Links </span> 
    Username: <?php echo $uname; ?> 
    </center> 
    </body> 
    </html>

テキストの間

マージンは100pxに

画像あり210

CSS：

#mainText { 

    margin-right:100px; 
    margin-left:100px; 

    }

出典

2012-04-16 John

あなたのHTMLとCSSを投稿してください。 – Curt

@Curt Added。しかし、まだ特別なことは何もありません。 – John

私はそれはあなたが望むだかもしれ理解していれば。

CSS

.left{ 
    float:left; 
    background:yellow; 
} 
.right{ 
    float:right; 
    background:green; 
} 
.middle{ 
    display:inline-block; 
    *display:inline/*For IE7*/ 
    *zoom:1; 
    vertical-align:top; 
    background:red; 
    margin:0 100px; 
} 
.parent{ 
    text-align:center; 
} 
.parent div{ 
    text-align:left; 
}

HTML

<div class="parent"> 
<p class="left">L side Text</p> 
<p class="middle">Center side Text</p> 
<p class="right">R side Text</p> 
</div>

チェックこのhttp://jsfiddle.net/XhMtK/3/

UPDATED

はあなたが

チェックこのhttp://jsfiddle.net/XhMtK/4/

出典

2012-04-16 11:36:16 sandeep

はい、私はここで見ることができるように、サイドテキストの長さによって、センタリングされたテキストの動きがあります。 – John

私の更新されたフィドルがあなたが望むかもしれないことを確認してください – sandeep

こんにちは、あなたがこの

CSS

.one{ 
width:90%; 
    margin:0 auto; 
    overflow:hidden; 
    background:green; 
    text-align:center; 
} 

.left{ 
    float:left; 
    background:yellow; 
    width:20%; 

} 

.center{ 
    margin:0 auto; 
    background:pink; 
    width:50%; 




} 

.right{ 
    float:right; 
    background:red; 
    width:20%; 

}

HTML

<div class="one"> 
    <div class="left">Left</div> 
    <div class="right">right</div> 
    <div class="center">center</div> 
</div>

などのフロートを使用できるよう望んだことがあります

ライブデモhttp://jsfiddle.net/rohitazad/JNxsZ/2/

出典

2012-04-16 11:36:32

答えて

関連する問題