0

！[ここに画像の説明を入力してください][1]テキストの後に横線を引きたいです。

div（#line）から出るコンテンツを非表示にする代わりに、まったく表示しません。#textlineテキストdivのサイズがわからないため、＃linedivはdivよりも大きくする必要があります。

編集：これがJfiddlehttp ://jsfiddle.net/wakary/8tTzz/2/です

#line {width：100;}を入力して、達成したいことを確認します。

編集:(私が達成したいこと、タイトルが変更されます）：

4

2 に答える 2

0

コンテナ要素の幅を削除すると機能します。

デモ

HTML

<div id="textline">
    <div id="text">Text</div>
    <div id="line">
        <div id="upspace"></div>
        <div id="ll"></div>    
    </div>
</div>

CSS

#textline
{
    height: 36px;
    margin-left: 20px;

}
#text
{
    float: left;
    color: green;
    height: 36px;
}
#line
{
    float: left;
    height: 36px;
    width: 400px;    
}
#upspace
{
    height: 10px;
}
#ll
{
    height: 1px;
    background-color: green;
}
于 2012-09-17T16:25:34.050 に答える
0

こんにちは私はあなたのコードにいくつかの小さな変更を加えました

#textline{
position: relative;
width: 400px;
height: 36px;
margin-left: 20px;
overflow: hidden;
}
#text{
position: absolute;
color: green;
height: 36px;
background:white;
padding-right:10px;
}
#line{   
position: absolute;
height: 10px;
width: 80%;  
border-bottom: 1px solid green;
}

そしてこのようなHTML

<div id="textline">
    <div id="line"></div>
    <div id="text">Text</div>
</div>

したがって、この場合、1つのdivが他のdivの上にあり、行はそのすべてのコンテナをカバーし、テキストはこの行の一部を非表示にします。

于 2012-09-17T16:31:33.643 に答える