无论我尝试过什么，我都无法让我的内部 div 在外部 div 内水平流动。请帮忙!!!
<style type="text/css">
#gallery {
width: 688px;
height: 360px;
border: solid;
}
#galleryelements {
width: 650px;
height: 320px;
display:inline;
background-color:#0FF;
}
.s-thumbnail {
width: 50px;
height: 75px;
border: solid;
}
.thumbnail {
width: 100px;
height: 150px;
border: solid;
}
#left {
float:left;
}
#right {
float:right;
}
#Mimage {
width: 200px;
height: 300px;
border: solid;
}
</style>
<body>
<div id="gallery">
<div id="galleryelements">
<div class="s-thumbnail" id="left"></div>
<div class="thumbnail" id="left"></div>
<div id="Mimage"></div>
<div class="thumbnail" id="right"></div>
<div class="s-thumbnail" id="right"></div>
</div>
</div>
</body>
</html>
最佳答案
你是这个意思吗？ http://jsfiddle.net/SebastianPataneMasuelli/xtdsv/
HTML:
<div id="gallery">
<div id="galleryelements">
<div class="s-thumbnail left" id=""></div>
<div class="thumbnail left" id="left"></div>
<div id="Mimage"></div>
<div class="thumbnail right" id=""></div>
<div class="s-thumbnail right" id=""></div>
</div>
</div>
CSS:
#gallery {
width: 688px;
height: 360px;
border: 1px solid red;
}
#galleryelements {
width: 650px;
height: 320px;
background-color:#0FF;
display: block;
}
.s-thumbnail {
width: 50px;
height: 75px;
border: solid;
}
.thumbnail {
width: 100px;
height: 150px;
border: solid;
}
.left {
float:left;
}
.right {
float:left;
}
#Mimage {
width: 200px;
height: 300px;
border: 1px solid green;
float: left;
}
关于html - 让我的 div 水平流动，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/4308523/