所以我现在正在设计一个网站(在
@L_301_0@和CSS上相当不错),但我事先在Photoshop上做了一个设计,这样我就可以直接编写代码并使网站成为我想要的.好吧,我有一个问题.尽管使用了内联块,我在一个更大的容器DIV内部有两个DIV元素,它们不会并排排列.这是css代码:
.contentContainer { display: block; width: 700px; height: 250px; margin: 20px auto; } .topContainer { height: 230px; padding: 10px; background-color: white; } .topThumbnail { display: inline-block; width: 370px; height: 230px; } .topThumbnail img { width: 370px; height: 230px; } .topInfo { display: inline-block; margin-left: 10px; width: 300px; height: 230px; } .topInfo p { width: 300px; height: 230px; background-color: pink; }
contentContainer是持有我的topContent和topThumbnail的最高DIV,所以我想我会把它扔进提供的代码中.
和HTML代码:
<div class="topContainer"> <div class="topThumbnail"> <img src="YT.png" /> </div> <div class="topInfo"> <p>Testing the information area of the top container or something along those lines</p> </div> </div>
无法发布图片来解释问题..需要10个声誉..会让人难以描述.
在设计中,缩略图和信息的两个容器应该是并排的并且在顶部对齐.缩略图应该位于topContainer的左侧,而信息应该位于缩略图的右侧,边距为10.由于某种原因,信息不会转到缩略图的右侧,而是去在它下面.我已将ALREADY设置为0以修复默认保证金问题.