我有几个看起来像是小提琴的div,但是想要homemidcontent div低于homebanner div?请帮忙.我怎么解决这个问题呢?
小提琴:在此输入链接描述
标记
<div id="homecontent-mid" class="row rounded">
<div id="homebanner" class="rounded">
<div class="sliderdiv">Slider Content</div>
<div class="main-search">Search Content Here</div>
</div>
<div id="homemidcontent" class="rounded">
<div id="home-mid-mid">Mid content here</div>
<div id="home-mid-right">Mid Content Right here</div>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
CSS
#homecontent-mid {
background: url("images/bg-stage.png") repeat-y scroll right top #FFFFFF;
border: 1px solid #BDBCBD;
margin-top: 0;
min-height: 100%;
outline: medium none;
overflow: visible;
position: relative;
}
#homebanner {
background: url("images/bg-stage-shade.png") repeat-x scroll 0 0 transparent;
padding-right: 20px;
position: relative;
}
.sliderdiv {
background: white;
float: …Run Code Online (Sandbox Code Playgroud) 我一直试图让两个div并排浮动(即sliderdiv和main-search)但似乎无法得到它.同样的小提琴:http://jsfiddle.net/Ar99F/1/
加价
<div id="homecontent" class="container">
<div id="homecontent-mid" class="row rounded">
<div id="homebanner" class="rounded">
<div class="sliderdiv">Content Goes Here</div>
<div class="main-search">Search Content Goes Here</div>
</div>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
CSS
#homecontent {
background: url("images/content-bg.png") repeat-x scroll 0 0 #FAFAFA;
position: relative;
}
#homecontent-mid {
background: url("images/bg-stage.png") repeat-y scroll right top #FFFFFF;
border: 1px solid #BDBCBD;
min-height: 100%;
outline: medium none;
top: -40px;
}
#homebanner {
background: url("images/bg-stage-shade.png") repeat-x scroll 0 0 transparent;
padding-right: 20px;
position: relative;
}
.rounded {
border-radius: 10px 10px …Run Code Online (Sandbox Code Playgroud) 我有一个下拉菜单,它似乎是由于父div而被削减,即如果我增加父div的高度,下拉菜单似乎可见.请帮忙.以下是我的代码:
标记
<div id="main-navigation" class="container">
<div class="menu rounded">
<ul id="navigation" class="l_tinynav1">
<select id="tinynav1" class="tinynav tinynav1">
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
CSS
#main-navigation .menu ul
{
background: none repeat scroll 0 0 #FFFFFF;
border-bottom: 1px solid #D51386;
border-left: 1px solid #D51386;
border-radius: 0 0 5px 5px;
border-right: 1px solid #D51386;
margin: 0 auto;
min-height: 38px;
overflow: visible;
width: 98%;
}
#main-navigation .menu li
{
border-left: 1px solid #E1E1E1;
border-right: 1px solid #C1C1C1;
float: left;
height: 38px;
position: relative;
top: 0;
}
Run Code Online (Sandbox Code Playgroud) 我正在尝试对div进行悬停效果,以使包含图像的div在悬停时向上移动。我希望“拍立得” div在悬停时向上移动。如果我只是将悬停类应用于img而不是整个div,则此效果有效。请帮忙。在这里摆弄
标记:
<div id="home-gal-col"> <span class="span-homegal">
<a href="/listings/category/accessories/">
<div class="polaroid">
<img src="/images/homegal/picture.jpg">
<p>picture</p>
</img>
</div>
</a>
</span>
</div>
Run Code Online (Sandbox Code Playgroud)
CSS:
#home-gal-col {
width:15%;
float:left;
padding:5px;
}
.polaroid {
border: 10px solid #fff;
border-bottom: 15px solid #fff;
-webkit-box-shadow: 3px 3px 3px #777;
-moz-box-shadow: 3px 3px 3px #777;
box-shadow: 3px 3px 3px #777;
}
.polaroid img {
margin: 0 auto;
width: 100%;
}
.polaroid p {
text-align: center;
color: #D51386;
}
.span-homegal a {
-webkit-transition: margin 0.2s ease-out;
-moz-transition: margin …Run Code Online (Sandbox Code Playgroud) 我有一个使用常量联系创建的html表,我想让它响应并适合持有它的容器div.
这是演示
我尝试了以下但这不起作用
<table border="0" width="100%" cellspacing="0" cellpadding="0">
Run Code Online (Sandbox Code Playgroud)