Website auf jeder Bildschirmgröße zentrieren funktioniert nicht?

VGOo

VGOo

New member
Wie der Titel schon sagt, schaff ich es einfach nicht, meine Website immer zentriert darzustellen, ich hab jetzt schon ziemlich alle Möglichkeiten zigmal durchgekaut, aber weiß noch immer nicht wo der Hund in der ganzen Sache begraben ist.

Hier der Code:
Spoiler:

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>SPK Solutions</title>
<style type="text/css">
<!--
body {
    background-color: #FFFFFF;
    margin: 0;
    padding: 0;
}

.container {
    width:auto;
    background-color: #FFF;
    margin: 0 auto;
    position: relative;
}

#spkwebsite-01_ {
    position:absolute;
    left:0px;
    top:0px;
    width:1920px;
    height:97px;
}

#spkwebsite-02_ {
    position:absolute;
    left:0px;
    top:97px;
    width:553px;
    height:983px;
}

#spkwebsite-03_ {
    position: absolute;
    left: 555px;
    top: 97px;
    width: 818px;
    height: 153px;
}

#spkwebsite-04_ {
    position:absolute;
    left:1371px;
    top:97px;
    width:549px;
    height:983px;
}

#spkwebsite-05_ {
    position:absolute;
    left:553px;
    top:250px;
    width:214px;
    height:52px;
}

#spkwebsite-06_ {
    position:absolute;
    left:767px;
    top:250px;
    width:195px;
    height:52px;
}

#spkwebsite-07_ {
    position:absolute;
    left:962px;
    top:250px;
    width:197px;
    height:52px;
}

#spkwebsite-08_ {
    position:absolute;
    left:1159px;
    top:250px;
    width:212px;
    height:52px;
}

#spkwebsite-09_ {
    position:absolute;
    left:553px;
    top:302px;
    width:818px;
    height:764px;
}

#spkwebsite-10_ {
    position:absolute;
    left:553px;
    top:1066px;
    width:818px;
    height:14px;
}

</style></head>

<body>

<div class="container">
 
    <div id="spkwebsite-03_">      <img id="spkwebsite_03" src="images/spkwebsite_03.gif" width="818" height="153" alt="" />    </div>
    <div id="spkwebsite-05_">      <img id="spkwebsite_05" src="images/spkwebsite_05.gif" width="214" height="52" alt="" />    </div>
    <div id="spkwebsite-06_">      <img id="spkwebsite_06" src="images/spkwebsite_06.gif" width="195" height="52" alt="" />    </div>
    <div id="spkwebsite-07_">      <img id="spkwebsite_07" src="images/spkwebsite_07.gif" width="197" height="52" alt="" />    </div>
    <div id="spkwebsite-08_">      <img id="spkwebsite_08" src="images/spkwebsite_08.gif" width="212" height="52" alt="" />    </div>
    <div id="spkwebsite-09_"><img id="spkwebsite_09" src="images/spkwebsite_09.gif" width="818" height="764" alt="" />    </div>
</div>

</body>
</html>
 
Wenn du margin auf auto setzt wird der container zentriert, aber nur wenn du eine feste Breite angibst. Da das aber nach einem Photoshop-Slice aussieht sollte das allerdings eh kein Problem sein.

Da dein container relativ positioniert ist orientieren sich die darin enthaltenen, absolut positionierten Elemente nach der Position vom container (left/top auf 0px ist die linke, obere Ecke von .container).
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Online-Statistiken

Zurzeit aktive Mitglieder
0
Zurzeit aktive Gäste
34
Besucher gesamt
34
Die Summen können auch versteckte Besucher enthalten.

Neueste Themen

Beliebte Forum-Themen

Zurück
Oben Unten