0

最近下载了960格系统玩玩。

现在我遇到的问题是在歌手词曲作者标签关闭后图像没有出现在左侧。图片前的两列加起来正好是 12

以下代码应在顶部显示徽标图像,在其右侧显示歌手词曲作者描述。然后在一个新行上,我应该看到灰色的图像占位符和一段文字来写。然而,它目前混在一起

如果我需要更改任何内容以容纳图像,谁能告诉我

这里是页面的链接http://digitalgenesis.com.au/sites/alice
和这里​​是我基本上希望它如何流动的链接http://digitalgenesis.com.au/sites/alice/img/960img.gif

页面代码

<html>
<head>
<link rel="stylesheet" type="text/css" media="screen" href="css/960.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/text.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/reset.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/main.css" />

       <title></title>
</head>

<body>
<div class="container_12">
<div class="grid_5"> <img src="img/namelogo.png" alt="#" /></div>
<div class="grid_7"> Singer/Songwriter</div>
<div class="grid_5"> <img src="img/img.jpg" alt="#" /></div>
<div class="grid_7"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris accumsan nunc vel odio faucibus euismod. Nulla semper lorem vel risus volutpat congue. Sed eleifend velit eget mauris luctus in imperdiet eros ultricies. Ut et gravida ligula. Vestibulum placerat placerat bibendum. Vestibulum pretium mollis arcu, et pharetra est sagittis sed. Vestibulum facilisis elementum urna vel fermentum. Vestibulum id metus at magna tristique ornare in id lorem. Nulla rhoncus, neque ac scelerisque varius, felis enim convallis ipsum, sed auctor libero dolor in ligula. Vivamus rhoncus, sapien non feugiat tempus, tortor enim euismod dolor, ac placerat ante enim sed diam. </div>
</div>
</body>
</html>

第二个网格 5 应该在新行上分开

4

2 回答 2

0

你正在寻找clearfix类来放下下一组 div

<div class="container_12">
<div class="grid_5"> <img src="img/namelogo.png" alt="#" /></div>
<div class="grid_7"> Singer/Songwriter</div>
<div class="clearfix"></div>
<div class="grid_5"> <img src="img/img.jpg" alt="#" /></div>
<div class="grid_7"> Lorem ipsum dolor sit amet,.... </div>
</div>
于 2011-03-10T04:34:27.263 回答
0

试试这个:

将您的重置放在 960.css 之前,然后在第一行之后添加一个 clear 。

单击此处查看示例 jsfiddle

这是我的代码:

<div class="grid_5"> <img src="http://digitalgenesis.com.au/sites/alice/img/namelogo.png" alt="#" /></div>
<div class="grid_7"> Singer/Songwriter</div>
    <div class="clear"></div>
    <div class="grid_5"> <img src="http://digitalgenesis.com.au/sites/alice/img/img.jpg" alt="#" /></div>
<div class="grid_7"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris accumsan nunc vel odio faucibus euismod. Nulla semper lorem vel risus volutpat congue. Sed eleifend velit eget mauris luctus in imperdiet eros ultricies. Ut et gravida ligula. Vestibulum placerat placerat bibendum. Vestibulum pretium mollis arcu, et pharetra est sagittis sed. Vestibulum facilisis elementum urna vel fermentum. Vestibulum id metus at magna tristique ornare in id lorem. Nulla rhoncus, neque ac scelerisque varius, felis enim convallis ipsum, sed auctor libero dolor in ligula. Vivamus rhoncus, sapien non feugiat tempus, tortor enim euismod dolor, ac placerat ante enim sed diam. </div>
于 2011-03-10T04:37:11.510 回答