Zitat geschrieben von
Sonc
pass das design doch auf den firefox an und korrigier dann eben für den iexplore mit nem if lte IE7
hehe danke für die antowrt aber das würd ich ja gerne xD
ich hab das nur nach meinen css kenntnissen gemacht und dachte das geht dann..
was muss ich den ändern für den FF spezifisch?
Stell hier mal den Code rein vlt hilft das:
@charset "utf-8";
/* CSS Document */
body {
background-color: #ffffff;
margin-top: 10px;
font-family: "Trebuchet MS",Arial,Verdana,Helvitica,sans-serif;
font-size: 11px;
color: #414141;
}
/* Layout Start */
#layout {
width: 600px;
height: auto;
margin: auto;
padding: 1px;
border: 1px solid #e3e3e3;
}
.title {
color: #414141;
font-size: 11px;
font-weight: bold;
position: relative;
margin-top: 4px;
margin-left: 4px;
margin-right: 4px;
}
/* Layout End */
/* Welcome Start */
#welcome {
background-color: #e3e3e3;
width: 600px;
height: 23px;
margin: auto;
}
/* Welcome End */
/* Header Start */
#header_switch {
background-image: url(../header/news.png);
width: 600px;
height: 80px;
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
}
/* Header End */
/* Navigation Start */
.grey #waxcontainer {
position: relative;
height: 48px;
background: #e3e3e3;
width: 600px;
font-family: "Trebuchet MS",Arial,Verdana,Helvitica,sans-serif;
}
.grey #waxnav {
position: relative;
height: 25px;
font-size: 11px;
font-weight: bold;
background: #fff url(/code/wax/images/wax/greywax_bottom.gif) repeat-x bottom left;
}
.grey #waxnav ul {
margin: 0px;
padding: 0 0 4px 0;
list-style-type: none;
width: auto;
float: left;
}
.grey #waxnav ul li {
display: block;
float: left;
margin: 0 1px;
}
.grey #waxnav ul li a {
display: block;
float: left;
color: #414141;
text-decoration: none;
padding: 0 0 0 12px;
height: 21px;
line-height: 195%;
}
.grey #waxnav ul li a span {
padding: 0 12px 0 0;
}
.grey #waxnav ul li a:hover,.grey #waxnav ul li a.current {
color: #fff;
background: #575757 url(/code/wax/images/wax/greywax_navtopleft.gif) no-repeat top left;
}
.grey #waxnav ul li a:hover span,.grey #waxnav ul li a.current span {
display: block;
width: auto;
background: #575757 url(/code/wax/images/wax/greywax_navtopright.gif) no-repeat top right;
}
/* Navigation End */
/* Content Start */
#content {
width: 600px;
height: auto;
float: left;
margin-top: 10px;
margin-bottom: 10px;
}
/* Page Start */
#page {
width: 450px;
height: auto;
float: left;
}
.page_content {
width: 440px;
height: auto;
float: left;
margin-right: 10px;
}
/* Page End */
/* Box Start */
#box {
width: 150px;
height: auto;
float: left;
}
.box_header {
background-color: #e3e3e3;
width: 150px;
height: 23px;
float: left;
margin-top: 10px;
margin-bottom: 10px;
}
.box_content {
width: 150px;
height: auto;
float: left;
}
/* Box End */
/* Content End */
/* Footer Start */
#footer {
background-color: #e3e3e3;
width: 600px;
height: 23px;
float: left;
}
#copyright {
color: #414141;
font-size: 9px;
font-weight: bold;
position: relative;
margin-top: 4px;
margin-left: 4px;
margin-right: 4px;
}
#copyright a {
color: #333333;
text-decoration: none;
}
/* Footer End */
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>News</title>
<link href="css/_style_news.css" rel="stylesheet" type="text/css" />
</head>
<body>
<!-- Layout Start -->
<div id="layout">
<!-- Welcome Start -->
<div id="welcome">
<div class="title">Willkommen auf pc-community.ch</div>
</div>
<!-- Welcome End -->
<!-- Header Start -->
<div id="header_switch"></div>
<!-- Header End -->
<!-- Navigation Start -->
<div class="grey">
<div id="waxcontainer">
<div id="waxnav">
<ul>
<li><a href="news.html" title="Aktuelle Informationen" class="current"><span>News</span></a></li>
<li><a href="archiv.html" title="Bisherige News"><span>Archiv</span></a></li>
<li><a href="angebote.html" title="Meine Leistungen"><span>Angebote</span></a></li>
<li><a href="portfolio.html" title="Beendete Arbeiten"><span>Portfolio</span></a></li>
<li><a href="downloads.html" title="Kostenlose Downloads"><span>Downloads</span></a></li>
<li><a href="kontakt.html" title="Kontaktieren Sie mich"><span>Kontakt</span></a></li>
</ul>
</div>
</div>
</div>
<!-- Navigation End -->
<!-- Content Start -->
<div id="content">
<!-- Page Start -->
<div id="page">
<!-- Page Content Start -->
<div class="page_content">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</div>
<!-- Page Content End -->
</div>
<!-- Page End -->
<!-- Box Start -->
<div id="box">
<!-- Box Angebot 1 Start -->
<div class="box_header">
<div class="title">Angebot #1</div>
</div>
<div class="box_content">Lorem ipsum dolor</div>
<!-- Box Angebot 1 End -->
<!-- Box Angebot 2 Start -->
<div class="box_header">
<div class="title">Angebot #2</div>
</div>
<div class="box_content">Lorem ipsum dolor</div>
<!-- Box Angebot 2 End -->
<!-- Box Angebot 1 Start -->
<div class="box_header">
<div class="title">Links</div>
</div>
<div class="box_content">Lorem ipsum dolor</div>
<!-- Box Angebot 1 End -->
<!-- Box Angebot 2 Start -->
<div class="box_header">
<div class="title">Letzte Arbeiten</div>
</div>
<div class="box_content">Lorem ipsum dolor</div>
<!-- Box Angebot 2 End -->
</div>
<!-- Box End -->
</div>
<!-- Content End -->
<!-- Footer Start -->
<div id="footer">
<div id="copyright">Copyright by <a href="http://www.pc-community.ch/">pc-community.ch</a></div>
</div>
<!-- Footer End -->
</div>
<!-- Layout End -->
</body>
</html>
mfG
So. 02.11.2008
17:56 Uhr
#1
