Rumah > hujung hadapan web > html tutorial > 两个并列div高度相同的问题_html/css_WEB-ITnose

两个并列div高度相同的问题_html/css_WEB-ITnose

WBOY
Lepaskan: 2016-06-21 09:43:43
asal
1379 orang telah melayarinya

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
Salin selepas log masuk


.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;}
Salin selepas log masuk


简单点就是这样 现在的问题是
在名称中它的值(就是id=namediv)如果长度过长的时候 那这个div就被撑高(因为长度设死了) 本来是表格一样的样式 就成了 简称那个地方的div左边框没有namediv的长只有一半
所以怎样做到简称那个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}
Salin selepas log masuk

这不是C#代码吧

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan