CSS新线问题

时间:2010-06-11 07:10:10

标签: html css layout templates

我正在尝试创建一个breezebrowser模板(用于在本地生成图像库,输出HTML)。我从我的wordpress模板中获取了HTML并设法生成以下库http://uploads.peasyphotos.com/20100607t-candids/gallery/,但每个图像都在一个新行上,我不知道为什么,我认为它在CSS中。我应该在CSS中寻找什么来尝试阻止它,或者我可以在模板代码中放置什么来禁用该部分的CSS?

由于

5 个答案:

答案 0 :(得分:1)

所以我有一个可靠的答案。

首先,你必须将这个css样式添加到图片的标签中:

display: inline-block;
height: 150px;
widht: 150px;
text-align: center;
vertical-align: top;

适用于Firefox 3.6。我不确定它是否适用于oure lovley IE:P

我希望我能帮忙!

答案 1 :(得分:0)

在你的css文件中,你有一个名为reset.css的文件。在第57行,您有一行称为显示块。评论出来看看。可能不是一个很好的观点。但是图像不会进入下一行。

答案 2 :(得分:0)

对于具有照片的锚元素,使用像这样的浮点数。这会很谨慎。

float:left;

答案 3 :(得分:0)

你的图片父锚标签没有正确的CSS。将类图像放在锚标签上,并使用以下css。

a.images {
border-bottom:1px solid #D8048D;
color:#D8048D;
display:block;
float:left;
height:159px;
margin:0 10px;
text-decoration:none;
width:100px;
}

答案 4 :(得分:0)

首先,我建议validating your html

其次,我建议将图像放在某种容器元素中:可能是无序列表。围绕这样一系列链接相互碰撞存在严重的可访问性问题,没有分离非空白字符。

第三,我会在列表中使用css类,并将其设置为如下样式:

ul.gallery { list-style: none}
ul.gallery li { float: left; clear: none; list-style: none}