ホームページ > ウェブフロントエンド > htmlチュートリアル > 同じ height_html/css_WEB-ITnose を持つ 2 つの並列 div の問題

同じ height_html/css_WEB-ITnose を持つ 2 つの並列 div の問題

WBOY
リリース: 2016-06-21 09:43:43
オリジナル
1379 人が閲覧しました

css div は、隣接する CSS div を展開します。

<div class="user_content"><ul><li >    <div class="cer_one">名称</div>    <div class="cer_two" id="namediv"><s:property value="user.userName"/></div>    <div class="cer_one">简称</div>    <div class="cer_two" id="chgdiv"><s:property value="user.shortName"/></div></li><li >    <div class="cer_one">年龄</div>    <div class="cer_two"><s:property value="user.age"/></div>    <div class="cer_one">学号</div>    <div class="cer_two" id="chgdiv"><s:property value="user.iden"/></div></li><li>......</li></ul></div
ログイン後にコピー


.user_content li{border-bottom : 1px #ccc solid;border-left : 1px #ccc solid;border-right : 1px #ccc solid;}.cer_one{ width:121px; text-align:right; margin:0px; padding-left:20px; line-height:34px;}.cer_two{ width:241px; text-align:left; margin:0px; padding-left:6px;line-height:34px;border-left: 1px #ccc solid;}
ログイン後にコピー


問題は、
名前の値 (つまり、id=namediv) です。長さが長すぎる場合、次に、この div は高く伸びました (長さが死ぬほど設定されていたため) 元々は table と同じスタイルでしたが、省略場所の div の左の境界線は namesiv ほど長くはなく、半分しかありませんでした。長いです
それで、略語 div をその隣のnamedivと同じくらい大きくするにはどうすればよいですか? 次に、左の境界線を表のフレームと同じになるように設定するだけです


私の表現に問題があるかどうかはわかりません
指定してください


ディスカッション (解決策) への返信

display:table-cell

   ul{padding:0; margin:0;display:table;}   ul li{ display:table-row;border-style:solid;border-color:#ccc;border-width:0 1px 1px 1px;}   ul li:first-child{border-top-width:1px;}   ul li div{ display:table-cell; line-height:34px}
ログイン後にコピー

これは C# コードではありません

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート