我在使用Internet Explorer时遇到困难。CSS和Internet Explorer
问题之一:
我用min-height:100%
,我没有,这并不在IE浏览器。我怎么能在我的CSS中设置“最小高度”?
问题二:
我用
position: relative;
z-index:50000;`
我的头,并在那里现在需要的不对齐。
我有SHIV安装
该网站的链接是http://buddywalknz.org
HTML(CMS的标签)
<!DOCTYPE html>
<head>
{pyro:theme:partial name="metadata"}
<body>
<header>
<div id="logo"></div>
</header>
<nav>
<ul>
{pyro:navigation:links group="header" indent="tab"}
</ul>
</nav>
<div id="mainContent">
{if ('{pyro:page:is_home}' == TRUE)}
<h1>Welcome</h1>
{else}
<h1>{pyro:page:title}</h1>
{/if}
<p>
{pyro:page:body}
</p>
<div id="gallery">
<div id="galleryMain"><img src="http://buddywalknz.org/uploads/default/files/accouncil_s.jpg" width="375" height="149" title="Proudly Supported by Auckland Council" alt="Auckland Council"></div>
{pyro:streams:cycle stream="sponsors"}
{entries}
<div class="galleryLogo"><a href="{company_website}"><img src="{company_logo.thumb}" title="Proudly Supported by {company_name}" alt="{company_name}"></a></div>
{/entries}
{/pyro:streams:cycle}
</div>
</div><!-- Main Content Close -->
</body>
</html>
CSS:
html{
background: url('../img/Body_BG.png') repeat-x 0 0 scroll;
background-color:#0C0C0C;
height:100%;
width:100%;
}
body{
width:960px;
height:100%;
min-height: 100% !important;
margin: 0 auto;
font-family:Verdana, Geneva, sans-serif;
}
h1{
margin:25px 0 0 25px;
font-family: 'Quicksand', sans-serif;
font-size:30px;
}
header{
height: 219px;
width: 551px;
margin:0 auto;
}
header #logo{
background:url('../img/logo.png') no-repeat scroll 0 0 transparent;
width:551px;
height:219px;
position: relative;
z-index:50000;
}
nav{
background:url('../img/navBG.png') no-repeat;
float:right;
width:135px;
height:100%;
padding:30px 0 0 0;
}
nav ul{
list-style:none;
margin:15px 0 0 0;
}
nav li{
margin:10px 0 0 -30px;
text-align:left;
text-indent:5px;
}
nav li a{
text-decoration:none;
color:#ff9f30;
font-family: 'Quicksand', sans-serif;
}
#mainContent{
float:right;
background:url('../img/mainBG.png') no-repeat;
width:707px;
height:auto;
min-height:100%;
margin:-35px auto;
}
#mainContent h1{
font-family: 'Quicksand', sans-serif;
}
#mainContent a{
color:#ff9f30;
font-weight:bold;
text-decoration: none;
}
#bottomBanner{
background: url('../img/bottomBanner.png') no-repeat;
width:478px;
height: 47px;
margin: -47px 0 0 300px;
}
#mainContent p{
margin:0 30px 0 30px;
font-size: 13px;
text-align:justify;
}
#Video{
margin: 30px 0 0 150px;
}
#Video #Vid{
border: 5px solid #4e2b97;
}
.img{
border: 5px solid #ff9f30;
}
a {
outline: none;
}
a img {
border: 1px solid #BBB;
padding: 2px;
margin: 10px 20px 10px 0;
vertical-align: top;
}
a img.last {
margin-right: 0;
}
ul {
margin-bottom: 24px;
padding-left: 30px;
}
#img{
margin-left: 25px;
}
#map{
margin:0 0 0 115px;
}
/* Sponsor Gallery CSS */
#gallery{
width:707px;
min-height: 100% !important;
margin:0 0 0 30px;
}
#galleryMain{
margin:0 0 0 150px;
}
.galleryLogo{
float:left;
width:200px;
height:200px;
margin:0 8px 5px 0;
}
#galleryLogo img{
border:none;
}
#galleryLogo a{
border:none;
text-decoration: none;
}
/* End Sponsor Gallery CSS */
#contact-form{
width:350px;
margin:10px auto;
}
#contact-form label{
float:left;
width:175px;
}
#contact-form input{
width:175px;
}
你知道你错过了一个关闭''标签吗? –
我们在这里谈论什么版本的IE? IE的最小高度技巧:http://www.dustindiaz.com/min-height-fast-hack/至于你的标题设置,z-index不应该改变它的位置。是不是位置:在你改变它之前是相对的? –
@MystereMan谢谢:) –