0
웹 페이지는 www.voteforvan.com입니다. 물론 파이어 폭스에서는 완벽합니다. IE7에서는 메뉴가 나타나지 않고 검색 창이 모두 사라졌습니다. IE8에서는 검색 창을 사용할 수 없습니다. 누군가가 내가 이것에 대한 답을 찾도록 도울 수 있습니까?저는 IE7과 IE8에 두 가지 CSS 문제가 있습니다.
웹 페이지는 www.voteforvan.com입니다. 물론 파이어 폭스에서는 완벽합니다. IE7에서는 메뉴가 나타나지 않고 검색 창이 모두 사라졌습니다. IE8에서는 검색 창을 사용할 수 없습니다. 누군가가 내가 이것에 대한 답을 찾도록 도울 수 있습니까?저는 IE7과 IE8에 두 가지 CSS 문제가 있습니다.
마크 업에는 많은 추가/불필요한 요소가 있으므로 문제의 원인을 정확히 찾아 내기가 어렵습니다.
이 코드는 Safari/Mac, Firefox/Mac, Opera/Mac, IE7 및 IE8에서 테스트되었으므로 기존 HTML로 구부릴 수 있습니다. 상속과 캐스 캐 이드를 조심하십시오. Firebug 또는 뭔가를 사용하여 기존 스타일 중 하나를 선택하지 않았는지 확인하십시오.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-gb" lang="en-gb" >
<head>
<title>Welcome</title>
<style type="text/css" media="screen">
body {
background-color: #5a5f4b;
font: 12px/1 Helvetica, Arial, sans-serif;
}
ul {
margin: 0;
padding: 0;
}
li {
float: left;
list-style: none;
}
a {
display: block;
border-left: 1px solid #fff;
border-top: 1px solid #cfdeff;
padding: 0.75em 1em;
}
a:link,
a:visited {
background-color: #aeb594;
color: #1133aa;
text-decoration: none;
}
a:hover,
a:active {
background-color: #fff;
color: #000;
text-decoration: underline;
}
form {
float: left;
margin-left: 10px;
display: inline; /* fixes double-margin float bug in IE; you can put this in a conditional stylesheet if you want */
}
</style>
</head>
<body>
<div id="tabarea">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Meet Van</a></li>
<li><a href="#">The News</a></li>
<li><a href="#">Events</a></li>
<li><a href="#">Search</a></li>
<li><a href="#">Donate</a></li>
</ul>
<form method="post" action="index.php">
<input type="text" value="search..." size="20" />
</form>
<br clear="all" />
</div>
</body>
</html>