Navigation und Website-Text zentriert
Domi
- css
Hallo zusammen,
ich brauche eure Hilfe. Ich erstelle momentan eine Website mit einem CSS Skript. Hierbei sind nun die Navigationsleiste und der Text zentriert. Ich weiß auch nicht, wie ich die Navigationsleiste linksbündig ausrichten soll und den Text im Hauptfenster ausrichten soll. Kann mir jemand vielleicht helfen?
Vielen Dank
Dominik
CSS-Skript:
/* CSS-Layout */
.container { width: 990px; }
.span-24 {width: 950px;}
.span-25 { width: 990px; margin: 0; }
.append-24 { padding-right: 960px; }
.prepend-26 padding-left: 960px; }
h1 { font-size: 2em; line-height: 1; margin-bottom: 0.5em; }
h2 { font-size: 1.5em; margin-bottom: 0.75em; }
h3 { font-size: 1.4em; line-height: 1; margin-bottom: 1em; }
h4 { font-size: 1.3em; line-height: 1.25; margin-bottom: 1.25em; }
h5 { font-size: 1.2em; font-weight: bold; margin-bottom: 1.5em; }
h6 { font-size: 1.1em; font-weight: bold; }
em {
background-color:transparent !important;
}
/* IE6 hack */
* html .span-12 {
w\idth:400px;
}
/* -------------------------------------- */
/* grid activation */
/* .container { background: url('../blueprint/lib/grid.png'); } */
body {
height: 780px;
text-align:center;
background-image:url('../bg.jpg');
}
#container {
background-color:#FFFFFF;
width:990px;
height: 770px;
padding:0.2em;border:5px solid #444;
color:#000066;
}
#logo {
background-color:#FFFFFF;
height: 100px;
text-align:left;
}
#header {
}
#mainnav{
list-style-type:none;
background-color:#FFFFFF;
text-align:left;
margin-top:0px;
font-family: "Arial Narrow";
font-size: 0.75em;
font-style: inherit;
font-variant:normal;
font-weight:bold;
line-height:110%;
text-decoration:none;
}
ul #Navigation {
width: 15em;
margin-left: 2em; padding: 0;
}
ul#Navigation li {
list-style: none; width:100px;
margin: 0; padding: 0.5em; text-decoration:none;
}
ul#Navigation a {
display: block;
padding: 0.2em;
font-weight: bold;
}
ul#Navigation a:link {
color: navy;
}
ul#Navigation a:visited {
color: navy;
}
ul#Navigation a:hover {
color: #0000FF;
}
ul#Navigation a:active {
color:#000066;
}
#Maincontent { padding:0; }
Index:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="ltr" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>...</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="Stylesheets/index.css" />
<style type="text/css">
.style1 {
text-decoration: none;
}
</style>
</head>
<body>
<div id="container">
<div id="logo">
<br/>
<img alt="Logo" src="logo.jpg" width="990" height="75" />
</div>
<div id="header">
<img alt="Header" src="header.jpg" width="990" height="75" />
</div>
<div id="mainnav" class="faux column span-3 prepend-1" style="width: 152px; height: 188px" align="left">
<ul id="Navigation" class="style1">
<li><a href="d0066.htm" class="style1">Home</a></li>
<li><a href="Danke.htm" class="style1">Über uns</a></li>
<li><a href="Dophaus.htm" class="style1">Ein- /
Zweifamilienhäuser</a></li>
<li><a href="e0132.htm" class="style1">Doppelhaushälften /
Reihenhäuser</a></li>
<li><a href="e0132.htm" class="style1">Mehrfamilienhäuser</a></li>
<li><a href="e0132.htm" class="style1">Gewerbeobjekte</a></li>
<li style="width: 100px"><a href="e0132.htm" class="style1">
Eigentums-wohnungen</a></li>
<li><a href="e0132.htm" class="style1">Grundstücke</a></li>
<li><a href="e0132.htm" class="style1">Kontakt</a></li>
<li><a href="e0132.htm" class="style1">Impressum</a></li>
</ul>
</div>
<div id="Maincontent" class="style1 column span-12">
<p class="style1">Herzlich Willkommen auf der Website von ...</p>
</div>
</div>
</body>
</html>
Hallo,
lenke deine Aufmerksamkeit mal auf
body {
height: 780px;
text-align:center;
background-image:url('../bg.jpg');
}
Merkst du was?
LG Kalle
Hallo,
lenke deine Aufmerksamkeit mal auf
body {
height: 780px;
text-align:center;
background-image:url('../bg.jpg');
}Merkst du was?
LG Kalle
Vielen Dank für den Hinweis, nur jetzt ist die Navigationsleiste zwar da wo sie hingehört, aber der Text gleichzeitig auch.
Hallo,
Vielen Dank für den Hinweis, nur jetzt ist die Navigationsleiste zwar da wo sie hingehört, aber der Text gleichzeitig auch.
Ja und? Dann musst du center auf den gewünschten Container anwenden.
Kalle