PSD-Tutorials.de
Forum für Design, Fotografie & Bildbearbeitung
Tutkit
Agentur
Hilfe
Kontakt
Start
Forum
Aktuelles
Besonderer Inhalt
Foren durchsuchen
Tutorials
News
Anmelden
Kostenlos registrieren
Aktuelles
Suche
Suche
Nur Titel durchsuchen
Von:
Menü
Anmelden
Kostenlos registrieren
App installieren
Installieren
JavaScript ist deaktiviert. Für eine bessere Darstellung aktiviere bitte JavaScript in deinem Browser, bevor du fortfährst.
Du verwendest einen veralteten Browser. Es ist möglich, dass diese oder andere Websites nicht korrekt angezeigt werden.
Du solltest ein Upgrade durchführen oder einen
alternativen Browser
verwenden.
Antworten auf deine Fragen:
Neues Thema erstellen
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
Webdesign: HTML/CSS, Responsive Design, Sass...
Problem bei Codierung
Beitrag
<blockquote data-quote="Doitsu" data-source="post: 948771" data-attributes="member: 295340"><p><strong>AW: Problem bei Codierung</strong></p><p></p><p>[code]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"></p><p><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"></p><p><head></p><p><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /></p><p><style type="text/css"></p><p><!--</p><p>body {</p><p> margin:0px;</p><p>}</p><p>div#main {</p><p> text-align:center</p><p>}</p><p></p><p>div#header1 {</p><p> margin:80px 0px 0px 200px;</p><p> width:300px; </p><p> height:60px;</p><p> border:1px solid #000;</p><p>}</p><p>div#header2 {</p><p> position:absolute;</p><p> left:604px; /* left bezieht sich so: margin-left vom header1 + width header 1 + width vom kasten + alle border groessen, wenn angegeben*/</p><p> top:80px;</p><p> border:1px solid #000;</p><p> width:400px;</p><p> height:60px;</p><p>}</p><p>div#kasten {</p><p> position:absolute;</p><p> top:40px;</p><p> left:502px; /* left: margin-left header + width header + border */</p><p> width:100px;</p><p> height:100px;</p><p> border:1px solid #000;</p><p>}</p><p>div#spruch {</p><p> position:absolute;</p><p> top:60px;</p><p> left:800px;</p><p>}</p><p>div#zusatz {</p><p> position:absolute;</p><p> left:502px;</p><p> top:145px; /* top: top vom kasten + height vom kasten + 5px abstand vom kasten (meine angabe) */</p><p> height:30px;</p><p> width:100px;</p><p> border:1px solid #000;</p><p>}</p><p>div#navi1 {</p><p> position:absolute;</p><p> left:614px; /* left: wie bei header2 + abstand (bei mir 10px) */</p><p> top:150px; /* top: top header2 + height header2 + 10px abstand*/</p><p> width:80px;</p><p> height:100px;</p><p> border:1px solid #000;</p><p>}</p><p>div#navi2 {</p><p> position:absolute;</p><p> left:704px; /* left: left navi1 + width navi1 + abstand 10px */</p><p> top:150px; /*top: wie navi1 */</p><p> width:80px;</p><p> height:100px;</p><p> border:1px solid #000;</p><p>}</p><p>div#navi3 {</p><p> position:absolute;</p><p> left:794px; /* left: left navi2 + width navi2 + abstand 10px */</p><p> top:150px; /* top: wie navi1 */</p><p> width:80px;</p><p> height:100px;</p><p> border:1px solid #000;</p><p>}</p><p>div ul { padding-left:16px; } /* abstand von links vom ul verringern (standard ca 30px) */</p><p>div#content {</p><p> margin:120px auto 0px auto; /* marign-top: top navi + height navi - margin-top header1 - height header1 + 10px abstand; left, rigth: auto - damit es zentriert ist */</p><p> width:500px;</p><p> height:500px;</p><p> border:1px solid #000;</p><p>}</p><p>--></p><p></style></p><p></head></p><p><body></p><p><div id="header1">header1</div></p><p><div id="header2">header2</div></p><p><div id="kasten">Kasten beim Header</div></p><p><div id="spruch">Spruch</div></p><p><div id="zusatz">Zusatz</div></p><p><div id="navi1"><h5>Ueberschrift1<h5></p><p> <ul></p><p> <li>Seite</li></p><p> <li>Seite2</li></p><p> <li>Seite3</li></p><p> </ul></p><p></div></p><p><div id="navi2"><h5>Ueberschrift2<h5></p><p> <ul></p><p> <li>Seite</li></p><p> <li>Seite2</li></p><p> <li>Seite3</li></p><p> </ul></p><p></div></p><p><div id="navi3"><h5>Ueberschrift3<h5></p><p> <ul></p><p> <li>Seite</li></p><p> <li>Seite2</li></p><p> <li>Seite3</li></p><p> </ul></p><p></div></p><p><div id="content">content</div></p><p></body></p><p></html>[/code]</p><p></p><p>Hoffe das geht so .. Genaueres musst du halt machen, border ist nur drin, damit du siehst, wann was anfaengt & aufhoert.</p><p></p><p>MfG..</p><p></p><p>Edit: <a href="http://seybold.jan-andresen.de/" target="_blank">http://seybold.jan-andresen.de/</a> - tu mir den gefallen, dafuer dass ich dir den code geschrieben habe, und lies das durch :></p></blockquote><p></p>
[QUOTE="Doitsu, post: 948771, member: 295340"] [b]AW: Problem bei Codierung[/b] [code]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css"> <!-- body { margin:0px; } div#main { text-align:center } div#header1 { margin:80px 0px 0px 200px; width:300px; height:60px; border:1px solid #000; } div#header2 { position:absolute; left:604px; /* left bezieht sich so: margin-left vom header1 + width header 1 + width vom kasten + alle border groessen, wenn angegeben*/ top:80px; border:1px solid #000; width:400px; height:60px; } div#kasten { position:absolute; top:40px; left:502px; /* left: margin-left header + width header + border */ width:100px; height:100px; border:1px solid #000; } div#spruch { position:absolute; top:60px; left:800px; } div#zusatz { position:absolute; left:502px; top:145px; /* top: top vom kasten + height vom kasten + 5px abstand vom kasten (meine angabe) */ height:30px; width:100px; border:1px solid #000; } div#navi1 { position:absolute; left:614px; /* left: wie bei header2 + abstand (bei mir 10px) */ top:150px; /* top: top header2 + height header2 + 10px abstand*/ width:80px; height:100px; border:1px solid #000; } div#navi2 { position:absolute; left:704px; /* left: left navi1 + width navi1 + abstand 10px */ top:150px; /*top: wie navi1 */ width:80px; height:100px; border:1px solid #000; } div#navi3 { position:absolute; left:794px; /* left: left navi2 + width navi2 + abstand 10px */ top:150px; /* top: wie navi1 */ width:80px; height:100px; border:1px solid #000; } div ul { padding-left:16px; } /* abstand von links vom ul verringern (standard ca 30px) */ div#content { margin:120px auto 0px auto; /* marign-top: top navi + height navi - margin-top header1 - height header1 + 10px abstand; left, rigth: auto - damit es zentriert ist */ width:500px; height:500px; border:1px solid #000; } --> </style> </head> <body> <div id="header1">header1</div> <div id="header2">header2</div> <div id="kasten">Kasten beim Header</div> <div id="spruch">Spruch</div> <div id="zusatz">Zusatz</div> <div id="navi1"><h5>Ueberschrift1<h5> <ul> <li>Seite</li> <li>Seite2</li> <li>Seite3</li> </ul> </div> <div id="navi2"><h5>Ueberschrift2<h5> <ul> <li>Seite</li> <li>Seite2</li> <li>Seite3</li> </ul> </div> <div id="navi3"><h5>Ueberschrift3<h5> <ul> <li>Seite</li> <li>Seite2</li> <li>Seite3</li> </ul> </div> <div id="content">content</div> </body> </html>[/code] Hoffe das geht so .. Genaueres musst du halt machen, border ist nur drin, damit du siehst, wann was anfaengt & aufhoert. MfG.. Edit: [url]http://seybold.jan-andresen.de/[/url] - tu mir den gefallen, dafuer dass ich dir den code geschrieben habe, und lies das durch :> [/QUOTE]
Bilder bitte
hier hochladen
und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Zitate einfügen…
Authentifizierung
Wenn ▲ = 5, ▼ = 2 und ■ = 7, was ist ▲ × ▼ + ■?
Antworten
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
Webdesign: HTML/CSS, Responsive Design, Sass...
Problem bei Codierung
Oben