样式问题 - ITeye问答

0 0

样式问题5

html
一个div
宽度高度是固定的。
每一行显示一个多选框后面是文字说明，
超出高度出现滚动条。

我试了很多次，第一行和第二行中间隔太多，2行数据就要滚动才能看到下面的。

问题样式见图。

问题补充：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<?xml version="1.0" encoding="UTF-8" ?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<style type="text/css">
.fixedHeight{
border: 1px solid green;
width: 150px;
height: 120px;;
line-height: 100px;
overflow: auto;
overflow-x: hidden;
}
</style>
</head>
<body class="lineBackgroundBody">56
<div class="fixedHeight">
<input type="checkbox" name="emails" value="${email.address }"/>
uyyu<br/>
<input type="checkbox" name="emails" value="${email.address }"/>
uyyu<br/>
<input type="checkbox" name="emails" value="${email.address }"/>
uyyu<br/>
<input type="checkbox" name="emails" value="${email.address }"/>
uyyu<br/>

</div>
</body>
</html>

问题补充：试过在div里用table ，还是一样。很行隔的很开

HTML CSS

2012年9月19日 15:32

zhou19890828
4
0 0 5

查看图片附件

2个答案按时间排序按投票排序

0 0

采纳的答案

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<?xml version="1.0" encoding="UTF-8" ?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<style type="text/css">
.fixedHeight{
border: 1px solid green;
width: 150px;
height: 120px;;
overflow: auto;
overflow-x: hidden;
}
.fixedHeight div{
   height:20px;
   width:100%;
   float:left;
}
</style>
</head>
<body class="lineBackgroundBody">56
<div class="fixedHeight">
<div ><input type="checkbox" name="emails" value="${email.address }"/> uyyu</div>
<div><input type="checkbox" name="emails" value="${email.address }"/> uyyu</div>
<div><input type="checkbox" name="emails" value="${email.address }"/> uyyu</div>
<div><input type="checkbox" name="emails" value="${email.address }"/> uyyu</div>
</div>
</body>
</html>