我一直试图将社交图标浮动到页面右侧,但由于某种原因它无法正常工作。
但页面顶部的文字完全浮出水面。
这是一个小提琴: check it out here
<div class="social">
<a href="/"><img src="img/twitter.png" width="32" height="32" alt="Twitter" /></a>
<a href="/"><img src="img/google_plus.png" width="32" height="32" alt="Google" /></a>
<a href="/"><img src="img/linkedin.png" width="32" height="32" alt="LinkedIn" /></a>
<a href="/"><img src="img/facebook.png" width="32" height="32" alt="Facebook" /></a>
</div>
答案 0 :(得分:1)
clear:both
在社交css中添加上述css
答案 1 :(得分:0)
试试这个css
#wrapper {
margin: 0px auto;
width: 940px;
padding: 15px 0px 0px;
position: relative;
text-align: left;
}
#header {
width: 940px;
margin: 0px;
padding: 0px;
background: none repeat scroll 0% 0% rgb(255, 255, 255);
overflow: hidden;
}
#mast-head {
width: 940px;
float: left;
margin: 0px;
padding: 0px 0px 10px;
background: none repeat scroll 0% 0% transparent !important;
position: relative;
}
a.logo-txt {
text-decoration: none;
padding: 0px;
display: block;
float: left;
margin: 0px;
}
a.logo-txt #logo {
margin: 0px;
padding: 0px;
}
.personalisation {
margin: 0px auto;
float: right;
}
.welcome {
font-size: 12px;
font-weight: bold;
}
.social {
margin: 100px 0px auto;
float: right;
width:100%
}
.social a{
float:right;
}
#nav{
border:1px solid #ccc;
border-width:1px 0;
list-style:none;
margin-top: 160px;
padding:0;
text-align:center;
}
#nav li{
display:inline;
}
#nav a{
display:inline-block;
padding:10px;
}
#nav ul{
position:absolute;
left:-9999px;
margin:0;
padding:0;
text-align:left;
}
#nav ul li{
display:block;
}