我正在为Wordpress制作一个自定义的子主题,我似乎无法获得100%的页脚宽度来表示。
实时示例页面:http://glustik.com/wordpress/
我尝试了多种方法,但我无法显示页脚背景,页脚的内容显示得很好。
Here is the Footer Code I am Using.(我正在尝试复制标头)
#footer{
width: 100%;
margin:20px 0 20px 0;
height:280px;
border: 1px solid;
border-top-color:rgba(255, 255, 255, 0.14);
border-bottom-color:rgba(0, 0, 0, 0.14);
border-left-color:rgba(0, 0, 0, 0.14);
border-right-color:rgba(0, 0, 0, 0.14);
display:block;
-moz-box-shadow: 0 0 15px 10px rgba(0,0,0,0.4);
-webkit-box-shadow: 0 0 15px 10px rgba(0,0,0,0.4);
box-shadow: 0 0 15px 10px rgba(0,0,0,0.4);
background: #262626; /* Old browsers */
background: -moz-linear-gradient(top, #262626 0%, #131313 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#262626), color-stop(100%,#131313)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #262626 0%,#131313 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #262626 0%,#131313 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #262626 0%,#131313 100%); /* IE10+ */
background: linear-gradient(top, #262626 0%,#131313 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=\'#262626\', endColorstr=\'#131313\',GradientType=0 ); /* IE6-9 */
}
Here is the HTML for my FOOTER.php : <div id="map">
<iframe width="425" height="150" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?hl=en&safe=off&q=3945+S+Durango+Dr+Ste+A6+Las+Vegas,+NV+89147&ie=UTF8&hq=&hnear=3945+S+Durango+Dr,+Las+Vegas,+Nevada+89147&gl=us&t=m&z=14&ll=36.117592,-115.27902&output=embed"></iframe>
</div><!-- #map -->
<div id="footerInfo">
<p>
<span class="bold">Address:</span><br />
3945 S Durango Dr<br />
Las Vegas, NV 89147<br /><br />
<span class="bold">Phone:</span><br />
702-349-0320<br /><br />
<span class="bold">Hours:</span><br />
11am - 3am
</p>
</div><!-- #footerInfo -->
<div id="socialMedia">
<p>
Facebook, Twitter, Yelp, and Kyara go Here.
</p>
</div><!-- #socialMedia -->
<div class="clearfix"></div>
<div id="copyright">
<p>Website Design by <a href="http://glustik.com">gluSTIK Multimedia</a></p>
</div><!-- #copyright -->
</div><!-- .wrapper -->