我正在寻找一个页脚类型的东西布莱克霍利网站 http://www.blakehawley.com它有一些不同的链接等。它应该是横幅样式,我的意思是它应该停留在底部并被修复。 div 是“菜单”
这是我的 HTML:
<html>
<head>
<link rel="stylesheet" media="all and (min-width: 1378px)" href="style/grid-1378.css">
<link rel="stylesheet" media="all and (min-width: 1218px) and (max-width: 1377px)" href="style/grid-1218.css">
<link rel="stylesheet" media="all and (min-width: 978px) and (max-width: 1217px)" href="style/grid-978.css">
<link rel="stylesheet" media="all and (min-width: 748px) and (max-width: 977px)" href="style/grid-748.css">
<link rel="stylesheet" media="all and (min-width: 0px) and (max-width: 747px)" href="style/grid-400.css">
<link href='http://fonts.googleapis.com/css?family=Playfair+Display' rel='stylesheet' type='text/css'>
<title>The Official Site of Blake Hawley</title>
</head>
<body>
<div id="homeimage">
<img src="style/images/blakehome.jpg">
</div>
<div id="name">
Blake Hawley
</div>
<div id="maincontent">
<a class="twitter-timeline" href="https://twitter.com/BlakeHawley5" data-widget-id="414439781083267072">Tweets by @BlakeHawley5</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</div>
<div id="menu">
</div>
</body>
</html>
这是我的CSS:
body{
margin:0 auto;
}
#homeimage{
margin:0 auto;
margin-top:20px;
width:720px;
height:480px;
box-shadow:5px 5px 5px #888888;
}
#name{
text-align:center;
font-family:'Playfair Display', serif;
font-size:130px;
}
#maincontent{
margin-bottom:20px;
}
#menu{
position:fixed;
float:bottom;
height:200px;
width:1218px;
border:3px solid green;
box-shadow:0px -5px 5px #888888;
}
li{
list-style:none;
}
大家有看到什么吗?
#menu{
position:fixed;
bottom: 0px;
height:200px;
width:1218px;
border:3px solid green;
box-shadow:0px -5px 5px #888888;
}
我猜应该可以解决问题,改变了第二条规则
(也许宽度也可以设置为:100%)
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)