<div id="footer">
<div class="row">
<div class="span5">
<img src="../goyal/webdesign.jpg" class="verisign-image"></div>
I am a
<select style="width:10%;" class="dropup">
<option value="select">--select--</option>
<option value="Business">Business</option>
<option value="Indivisual">Indivisual</option>
</select>
<button class="btn dropdown-toggle btn-Warning" style="margin-top:-1%;">Go!
</button>
<div class="span5" style="float:right;">
<div class="footer-feedback">
<p class="left">Add & claim your business link|
<a href="">link1</a>|
<a href="">link2</a>
</p>
<span class="footer-feedback">
<h5>Feedback</h5>
</span>
</div>
</div><!--span5 -->
</div><!--span5 -->
</div><!-- row -->
</div>
的CSS:
div#footer {
position:fixed;
left:0px;
bottom:0px;
height:30px;
width:100%;
background:#eee;
}
/* IE 6 */
* html #footer {
position:absolute;
top:expression((0-(footer.offsetHeight)+(document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight)+(ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop))+'px');
}
span.footer-feedback{
color:#fff;
float:right;
width:80px;
height:100%;
background:green;
}
p.left {
text-align:left;
float:left;
}
p.right {
float:right;
text-align:right;
}
我想要在页脚中正确对齐。 喜欢在绿地中间的反馈。 和绿色的左侧是我想要这个文字“添加&amp;声称您的业务链接| link2 | link3” 在中间“我是一个,选择并去” 去橙色的按钮。 我的页脚是固定的
答案 0 :(得分:1)
以下是fiddle link
<强> HTML 强>
<div id="footer">
<div class="row">
<div class="span5"><img src="../goyal/webdesign.jpg" class="verisign-image"></div>
<div class="orange">
I am a
<select class="dropup">
<option value="select">--select--</option>
<option value="Business">Business</option>
<option value="Indivisual">Indivisual</option>
</select>
<button class="btn dropdown-toggle btn-Warning" style="margin-top:-1%;">Go!</button>
</div>
<p class="left">Add & claim your business link|
<a href="">link1</a>|
<a href="">link2</a>
</p>
<div class="span5" style="float:right;">
<div class="footer-feedback">
<span class="footer-feedback">
<h5>Feedback</h5>
</span>
</div>
</div><!--span5 -->
</div><!--span5 -->
</div>
<强> CSS 强>
div#footer {
position:fixed;
left:0px;
bottom:0px;
/*height:30px;*/
width:100%;
background:#eee;
text-align:center;
padding:5px 0;
}
select.dropup {
width:200px;
}
/* IE 6 */
* html #footer {
position:absolute;
top:expression((0-(footer.offsetHeight)+(document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight)+(ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop))+'px');
}
span.footer-feedback{
color:#fff;
float:right;
width:80px;
height:100%;
background:green;
text-align:center;
}
p.left {
display:inline-block;
}
p.right {
float:right;
text-align:right;
}
.orange {
/*background-color:#ff9a2e;
overflow:hidden;
height:100%;*/
float:left;
width:auto;
}
答案 1 :(得分:0)
只需替换你的Css这个Css
div#footer {
position: fixed;
left: 0px;
bottom: 0px;
/*height: 30px;*/
width: 100%;
background: #eee;
}
只需删除&#39; dif#footer&#39;标签