• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Dokument zentrieren

D

djfabi

Mitglied
Hallo ich habe mal eine Frage also hier erstmal der HTML code mit dem Css und Javascipt (momentan noch alles eine Datei, ich trenne das bals
icon_smile.gif
)



HTML: 
<!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" xml:lang="de" lang="de">
<head> <title>Titel</title>    <meta name="author" content="Ich" /><script type="text/javascript">function spoil(id){if (document.getElementById) {var divid = document.getElementById(id);divid.style.display = (divid.style.display=='block'?'none':'block');} }</script><style type="text/css">html {    background-color: #C0C0C0;;    font: Arial;    height: 100%;    width: 100%;    position: absolute;    top: 0px;    left: 0px;}#header {    height: 80px;    width: 100%;    background-color: #808080;    position: absolute;    top: 0px;    left: 0px;}#headmitte {    height: 80px;    width: 500px;    background-color: #808080;    margin: 0 auto;}h1 {    color: #FFFFFF;    margin-top: -32px;    margin-left: 90px;    font-weight: bold;    font-size: 35px;    }#l1 {    margin-top: 30px;    margin-left: 30px;}#r1 {    margin-top: -68px;    margin-left: 450px;}#backzus {    position: absolute;    top: 30px;    left: 30px;    width: 52px;}#sid1 {    position: absolute;    top: 30px;    right: 30px;    width: 12px;}#id1 {    border: 1px solid black;    height: 170px;    width: 90px;    position: absolute;    top: 70px;    right: 30px;    padding-left: 10px;    padding-top: 10px;    background-color: #FFFFFF;}.diva {    color: #000000;    text-decoration: none;}.diva:hover {    background-color: #4169e1;    color: #FFFFFF;}#document {    background-color: #FFFFFF;    height: 100%;    width: 800px;    margin: 0 auto;    margin-top: 0px;}</style></head><body></div><div id="header"><div id="headmitte"><input type="button" id="l1" href="#"/><h1>Ueberschrift - H1234</h1><input type="button" id="r1" href="#"/></div><button href="#" id="backzus">Zur&uuml;ck</button><input type="button" id="sid1" style="cursor: pointer;" onclick="spoil('id1');" /><div id="id1" style="display:none;"><a class="diva"  href="#">&ouml;&ouml;&ouml;</a><a class="diva"  href="#">&Uuk</a><a class="diva"  href="#">jjjjjjjjj</a><a class="diva"  href="#">gggggg</a><a class="diva"  href="#">ffffffff</a><a class="diva"  href="#">dddddddd</a><a class="diva"  href="#">sssssss</a><a class="diva"  href="#">xxxxxx</a></div><div id="document"></div> </body></html>


Also ich möchte das Document margin: 0 auto ist aber trotzdem 100 %, wie mache ich das?


also so...UNTITLED.jpg
 
Du meinst wohl eher, dass der Content-Bereich zentriert ist und links und recht noch irgendetwas anderes kommen (Menü?) könnte?

Könntest Du auch versuchen den Quellcode nochmal mit Zeilenumbrüchen zu posten?

Moderation: Habe den Titel angepasst. Nur "Css" ist nicht ausreichend. Bitte achte künftig mehr darauf.
 
ne links und rechts kommt nichts mehr..
Der war eig mit Umbrüchen, wurde hier aber nicht angezeigt.

Also ich habe als erstes im DIV ein Header definiert der ist 80px so danach kommt ein DIV das ist Document so. Wenn ich Document auf 100% setze dann wird es nur 80px hoch angezeigt.... Wenn ich es auf zb 700px setze ist die Höhe mehr, aber ich will ja das es automatisch 100% sind, also das es auf jedem Bildschirm gleich dagestellt wird... Also wie mache ich das?
 
Hallo,

also das mit den umbrüchen da kämpfe ich auch fast jedesmal mit dem editor hier :O).

Das grundproblem ist wenn man mit position arbeitet aber nicht weiss was das macht, was ich aus dem code erkennen konnte.
Mit dem Bild konnte ich nicht viel anfangen :o).

mach doch ein div id=wrapper mit height:100%; margin: 0 Auto; und breite wie inhalt werden soll 500px damit hast den inhalt mittig aber ohne osition :O).
Der rest machts inherhalb in dem div oder hintergrund bild von body.

Cheffchen
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben