Suche im Forum:
Suchen


Autor Nachricht
Beitrag24.04.2010 um 21:11 (UTC)    
Titel: CSS-Problem beim Zentrieren

Hi leute ich habe ein Problem beim Zentrieren der Seite mein CSS-Code sieht wie folgt aus
Zitat:
#extraDiv1 {display: none;}
#extraDiv2 {display: none;}
#extraDiv3 {display: none;}
#extraDiv4 {display: none;}
#extraDiv5 {display: none;}
#extraDiv6 {display: none;}
#pre_header {display: none;}
#post_header {display: none;}

#nav_heading{display: none;}
div.header{display: none;}
h1#title{display: none;}
h2#title span {display: none;}

a{
color:#000000;
text-decoration: none;
font-size:13px;}

a:hover {
color: #4A9AF6;
font-size: 13px;
text-decoration: none;}

a:link {
color: #4A9AF6;
font-size: 13px;
text-decoration: none;}

a:active {
color: #4A9AF6;
font-size: 13px;
text-decoration: none;}

a:visited {
color: #4A9AF6;
font-size: 13px;
text-decoration: none;}


body {
background-color:#000000;
left: 50%;
background-image:url();}


#header_container {
left: 50%;
margin-left:200px;
padding: 5px;
width: 1000px;
height:200px;
background-color:#343434;
background-image:url();
color:#FFFFFF;
font-size:13px;
border: 1px solid #FFFFFF;
-moz-border-radius: 10px;}


#content {
left: 50%;
margin-left:380px;
margin-top:-315px;
width: 820px;
color: #000000;
padding: 5px;
padding-bottom: 20px;
font-size: 14px;
font-family: Arial;
background-color:#045687;
background-image:url();
border: 1px solid #FFFFFF;
-moz-border-radius-topright: 10px;
-moz-border-radius-topleft: 10px;}


#nav_container {
left: 50%;
margin-left: 200px;
margin-top:20px;
width: 160px;
height: auto;
background-color:#C1490E;
background-image:url();
border:1px solid #FFFFFF;
color:#XXXXXX;
-moz-border-radius: 10px;}

ul#nav{
width: 130px;
padding: 0px;
margin: 0px;}

li.nav_element{
list-style-type: none;
position: relative;
padding-bottom:15px;
padding-left:2px;
border: 1px;
width: 110px;
height: 20px;
text-align: left;}

li.nav_element a{
display: block;
padding:3px;
width: 115px;
height: 20px;
margin: 10px;
color: #F2F2F2;
font-weight: bold;
text-decoration: none;
background-color: #xxxxxx;
border: 0px solid #ffffff;
text-align: left;}

li.nav_element a:hover{
display: block;
color: transparent;
font-weight: bold;
text-decoration: none;
background-color: #XXXXXX;
color:#000000;
border: 0px solid #ffffff;
text-align: left;}

#content_footer{
left: 50%;
margin-left: 380px;
margin-bottom:0px;
margin-top: -21px;
height: 20px;
padding:5px;
width: 820px;
font-family:Arial;
font-size:12px;
color:#FFFFFF;
background-color:#656565;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border: 1px solid #ffffff;}


ich wäre sehr dankbar wenn mir jemand sagen könnte warum es auf verschiedenen Auflösungen immer anders Platziert ist

PS.: der befehl position:absolute darf nicht im code vorkommen sonst funktioniert der Footer nich mehr.

Danke im Voraus Very Happy
Beitrag24.04.2010 um 22:09 (UTC)    
Titel:

Ich bin zwar selbst nicht so der Css Pro aber ich denke an der Stelle kann ich aushelfen:

Um die Seite für alle Ansichten zu zentrieren verwende diesen Code:
Code:
body {
margin: auto
width: 900px;
}

Du solltest außerdem eine Breite (width) der Seite definieren, da du so die einzelnen Bestandteile (Content, Navi ...) einfacher anordnen kannst.
______________
Rechtschreibfehler sind gewollt und erhöhen die Qualität des Beitrags.


Zuletzt bearbeitet von badweb am 24.04.2010, 23:10, insgesamt 2-mal bearbeitet
Beitrag25.04.2010 um 06:49 (UTC)    
Titel:

Danke, es hat geklappt jetzt kann ich mein design endlich ändern und es wird zum Geburtstag (30.04.2010) meiner Seite fertig sein. Wer will kann dann ja mal reinschauen Very Happy

Kann geschlossen werden.
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de