Home > Web Front-end > HTML Tutorial > 两个并列div高度相同的问题_html/css_WEB-ITnose

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

WBOY
Release: 2016-06-21 09:43:43
Original
1379 people have browsed it

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
Copy after login


.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;}
Copy after login


简单点就是这样 现在的问题是
在名称中它的值(就是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}
Copy after login

这不是C#代码吧

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template