2010-11-25 8 views
1

次のマークアップがあります。テキストが緑色の背景に表示されます。どうすればこれを達成できますか?私はこの種の問題が起こっている、私は将来どのような問題が起こらないように変更することができますか?行内にテキストを作成したい

<style type="text/css">  
#tb_enter {  
} 
.gib_nav { 
    background-color:green; 
    background-position:0 0; 
    background-repeat:no-repeat; 
    border:medium none; 
    cursor:pointer; 
    display:none; 
    float:right; 
    height:324px; 
    position:relative; 
    width:25px; 

} 
#text{ 
margin-top:100px; 
-moz-transform: rotate(-270deg);  
width:25px; 
}  
</style> 

<html> 
<head> 
<title>How to use external cursor type using CSS</title> 
</head> 
<body> 
<div style="display: block;" id="tb_enter" class="gib_nav"> 
    <div id="text">Enter Rahul Gib</div> 
</div> 
</body> 
</html> 

答えて

0

.gib_navクラスの幅指定を削除します。これにより、含まれているテキストが必要に応じてdivの幅を押し出すことができます。

例:

http://jsfiddle.net/VaY84/

編集:

(コメントを参照してください)質問の作者は一行だけでdivの表示内のテキストを作るためにwhite-space: nowrap; CSSスタイル属性を探していたのではなく、複数の行に折り返します。

+0

@Brandonこれは書いて来ません – XMen

+1

「来て書く」という意味を説明してくれるかもしれません。 –

+0

テキストは緑色の帯の真ん中に垂直に来るべきです – XMen

関連する問題