Wow ich liebe dich, Mondstein flieg und Sieg!:D. Danke
Beiträge von Alfredo
-
-
Hallo,
ich bin relativ neu im Programmieren und habe meine Eigene Seite programmiert. Diese befindet sich Links oben in der Ecke und ich hätte diese gerne Mittig im Screen ausgerichtet.
Wie mache ich das?. Habe mehrere Codes von Google verwendet, keines davon hat geklappt.
HTML
Alles anzeigenHtml Code <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <link href="style.css"rel="stylesheet"> </head> <body> <header> <img src="./img/header.jpg"> </header> <nav> <li id="li1"><a href="#Geschichte">Geschichte</a></li> <li id="li2"><a href="#Innovation">Innovation</a></li> <li id="li3"><a href="#Interessantes">Interessantes</a></li> </nav> <main> <p> </p> </main> <aside id="aside1"> <img src="./img/aside1.jpg"> </aside> <aside id="aside2"> <img src="./img/aside2.jpg"> </aside> <footer> <ul> <li id="li5"><a href="#Kontakt">Kontakt</a></li> <li id="li6"><a href="#Impressum">Impressum</a></li> <li id="li7"><a href="#AGB">AGB</a></li> </ul> </footer> </body> </html>
Code
Alles anzeigenund das ist der CSS Code: header{ width:800px; height:100px; background-color:blue; } nav{ width:800px; height:25px; background-color:darkgrey; font-family:Verdana; color:#fff; } #li1 a{ color:white; background-color:black; list-style-type:none; padding-bottom:5px; text-decoration:none; font-size:14px; padding-top:1px; } #li2 a{ color:white; background-color:dodgerblue; padding-bottom:5px; text-decoration:none; padding-left:5px; padding-right:5px; margin:-5px; font-size:15px; } #li3 a{ color:white; background-color:green; padding-bottom:5px; text-decoration:none; margin:-2px; font-size:15px; } #li1 { display:inline-block; } #li2 { display:inline-block; } #li3 { display:inline-block; } #li1 :hover{ background-color:yellow; color:green; } #li2 :hover{ background-color:yellow; color:green } #li3 :hover{ background-color:yellow; color:green; } main{ width:400px; height:300px; background-color:white; font-family:Verdana; color:#333; line-height: 18px; float:left; } #aside1{ width:200px; height:300px; background-color:brown; float:left; } #aside2 { width:200px; height:300px; background-color: black; float:left; } footer{ width:800px; height:25px; background-color:lightslategrey; clear:both; } #li5 { display:inline-block; } #li6 { display:inline-block; } #li7 { display:inline-block; } ul { text-align:center; list-style-type:none; text-align:right; } #li5 a{ text-decoration:none; color:black; padding-bottom:5px; } #li6 a{ text-decoration:none; color:black; } #li7 a{ text-decoration:none; color:black; }