我需要创建一个包含多个其他DIV的容器DIV样式.如果浏览器窗口调整为狭窄,则会询问这些DIV不会换行.
我试着让它像下面这样工作.
<style>
.container
{
min-width: 3000px;
overflow: hidden;
}
.slide
{
float: left;
}
</style>
<div class="container">
<div class="slide">something</div>
<div class="slide">something</div>
<div class="slide">something</div>
<div class="slide">something</div>
</div>
Run Code Online (Sandbox Code Playgroud)
这适用于大多数情况.但是,在某些特殊情况下,渲染不正确.我发现容器DIV在IE7的RTL中变为3000px宽度; 它变得凌乱.
有没有其他方法可以让容器DIV不包装?
所以我现在设计一个网站(漂亮nooby在HTML和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;
}
Run Code Online (Sandbox Code Playgroud)
该contentContainer最高DIV抱着我topContent和topThumbnail,所以我想我应该把它扔进所提供的代码.和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 …Run Code Online (Sandbox Code Playgroud)