[Noob Problem]CSS-HP im Center

.0nLy · 10/29/2012, 13:05

Hallo Leute, Ich möchte meine ganze Homepage(nicht nur den Text) zentriert haben. Dafür arbeite ich mit CSS und HTML. Ich habe einen "Oberdiv" container erstellt und im css dann aufgerufen, so sieht der Code aus:
css-code:

Code:

#website{
      width:980px;
      margin: 0 auto;
}

und html code dann so:

HTML Code:

<div id="website">HIER DRINN DIE ANDEREN DIV'S </div>

so müsste es doch eigentlich gehen oder nicht? Tut es aber nicht!

mfg

boxxiebabee · 10/29/2012, 13:09

Ja.

.0nLy · 10/29/2012, 13:09

das Tut es aber nicht

boxxiebabee · 10/29/2012, 13:12

Bitte nicht so viele Infos auf einmal.
Was passiert denn?
Zeig mal das ganze Html & CSS her.

Code:

<!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>Untitled Document</title>
<style>
#wrapper {
	width: 980px;
	margin: 0 auto;
	background-color: #09F;
}
</style>
</head>

<body>
<div id="wrapper"> TEXT </div>
</body>
</html>

DasPrinzip. · 10/29/2012, 13:13

meinst du vielleicht:

Code:

#website{
      width:980px;
      position: center;
}

?

NotEnoughForYou · 10/29/2012, 13:32

Quote:
Originally Posted by DasPrinzip.
meinst du vielleicht:
Code:
#website{
      width:980px;
      position: center;
}
?

bitte was ?

@te :
hast du die css auch richtig eingebunden ? Oder verwirrt es dich nur, dass deine Schrift beispielsweise nicht 100 % in der Mitte ist sondern in deinem Div links sitzt ?

.0nLy · 10/29/2012, 13:41

Es ist richtig eingebunden.
Nein die komplette Homepage ist linksbündig der Text der ist in der Mitte das habe ich im Body bei der CSS eingebunden "text-align" ...

NotEnoughForYou · 10/29/2012, 13:45

könntest du vlt. mal den code zeigen oder einen link geben ?

マルコ · 10/29/2012, 13:47

Hast du einen Link? Das ginge am schnellsten, um das Problem zu finden...
Oder du gibst uns den Quelltext.

edit: verdammt, NE4Y war schneller^^

.0nLy · 10/29/2012, 13:58

Okay wenn ich wieder am pc bin stell ich Code rein von html und css

CSS Datei:

Code:

body{
    width:980px;
    background-color:CCCCCC;
    text-align:center;
}

#website{
        width:980px;
        margin: 0 auto;
}

#header{
        width:980px;
        height:150px;
        background:orange;
        border-radius:20px;
        margin-top:5px;
            
}

#navi{
        width:980px;
        height:40px;
        margin-top:10px;
        background:red;
        border-radius:10px;
}
#content{
        width:980px;
        height:600px;
        margin-top:10px;
        background:green;
        border-radius:20px;
}

#footer{
        width:980px;
        height:30px;
        margin-top:10px;
        background:yellow;
        border-radius:10px
}

HTML datei:

HTML Code:

<html>
    <head>
         <title>---Testseite---</title>
        <link rel="stylesheet" type="text/css" href="style.css"
        
    </head>   
    <body>
        <div id="website">
            <div id="header">
            <h1>Dein Titel</h1>
            </div>    
            <div id="navi"> Hallo
            </div>
            <div id="content">
                Hi,wie gehts?
            </div>
            <div id="footer">
                by Wadim
            </div>
            
        </div>
   
    </body> 
</html>

nephren · 10/29/2012, 16:01

Code:

margin-left:XXXpx;

In deine jeweiligen Div-Boxen =)

Code:

#header{
        width:980px;
        height:150px;
        background:orange;
        border-radius:20px;
        margin-top:5px;
	margin-left:500px;

devcode · 10/29/2012, 16:20

Lösch aus deinem body-tag die Breite, dann sollte es gehen.

.0nLy · 10/29/2012, 16:22

Okay ich probiere es später und sag dann bescheid

Immer wieder margin-left xx px zu schreiben ist doch auch nicht die richtige lösung oder?

Masterakio1995 · 10/29/2012, 17:42

Quote:

Originally Posted by .0nLy

Okay wenn ich wieder am pc bin stell ich Code rein von html und css

HTML datei:

Quote:

<html>
<head>
<title>---Testseite---</title>
<link rel="stylesheet" type="text/css" href="style.css">

</head>
<body>
<div id="website">
<div id="header">
<h1>Dein Titel</h1>
</div>
<div id="navi"> Hallo
</div>
<div id="content">
Hi,wie gehts?
</div>
<div id="footer">
by Wadim
</div>

</div>

</body>
</html>

Öhmmmmm... ?

.0nLy · 10/29/2012, 17:51

Quote:

Originally Posted by Masterakio1995

Öhmmmmm... ?

Ja was ist denn?