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...
CSS-HP, positionierung klappt nicht
Beitrag
<blockquote data-quote="Hubu300" data-source="post: 1491117" data-attributes="member: 195071"><p>Also ich habe ein Problem..eigentlich habe ich zwei xD... Ich soll für die Uni eine CSS-basierte HP erstellen, die HTML-Datei dürfen wir nicht verändern...so bin auch schon gut vorangekommen denke ich, aber bei mir wollen sich die Boxen einfach nicht verschieben, mit padding klappt es zwar anscheinend, allerdings nur im Programm im Browser sieht es wieder ganz anders aus -.- und mit position bewegt sich gar nichts -.- ich weiß einfach nicht wie ich das hinbekomme =(</p><p></p><p> <<dazugehöriges Layout, #vers1 und 2 sollen eben im Spiegel stehen und die Überschrift auf dem Block...aber wie gesagt es bewegt sich nichts oder komplett flasch</p><p></p><p>[code]</p><p>body {</p><p> background-color: #584E3F;</p><p> background-image: url(design.png);</p><p> background-repeat: no-repeat;</p><p>}</p><p>#wrapper {</p><p></p><p> text-align:left;</p><p> padding-top:200px;</p><p> padding-right:0px;</p><p> padding-bottom:30px;</p><p> padding-left:580px;</p><p>}</p><p></p><p>#navigation ul li ul {</p><p></p><p> display: none;</p><p></p><p>}</p><p></p><p>#navigation {</p><p></p><p> padding-bottom:40px;</p><p></p><p>}</p><p></p><p>#navigation a {</p><p></p><p> color: #d5b76c;</p><p> text-decoration:none;</p><p> float:left;</p><p> padding-right:40px;</p><p></p><p></p><p>}</p><p></p><p>#vers1 {</p><p> font-size: 12px;</p><p> text-align: center;</p><p> padding-top: 40px;</p><p> height: 240px;</p><p></p><p>}</p><p>#vers2 {</p><p> font-size: 12px;</p><p> text-align:center;</p><p>}</p><p></p><p>.chor {</p><p> font-style: italic;</p><p>}</p><p></p><p>.intitiale {</p><p> font-family: "Times New Roman", Times, serif;</p><p> font-size: 20px;</p><p> color: #000000;</p><p>}</p><p>.text {</p><p>}</p><p></p><p>h1 {</p><p> font-family: "Courier New", Courier, monospace;</p><p> font-size: 40px;</p><p> font-style: normal;</p><p> font-weight: bolder;</p><p> color: #000000;</p><p>}</p><p></p><p>[/code][code]</p><p><?xml version="1.0" encoding="ISO-8859-1"?></p><p><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" </p><p> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"></p><p><html xmlns="http://www.w3.org/1999/xhtml"></p><p><head></p><p> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></p><p> <title>Ode an die Freude &middot; Friedrich Schiller</title></p><p> <link href="ode.css" rel="stylesheet" type="text/css" /></p><p></head></p><p><body></p><p><div id="wrapper"></p><p> <h1>An die Freude.</h1></p><p> <div id="vers1"></p><p> <div class="text"></p><p> <p><span class="intitiale">F</span>reude, sch&ouml;ner G&ouml;tterfunken,<br /></p><p> Tochter aus Elisium,<br /></p><p> Wir betreten feuertrunken,<br /></p><p> Himmlische, dein Heiligthum.<br /></p><p> Deine Zauber binden wieder,<br /></p><p> Was die Mode streng getheilt,<br /></p><p> Alle Menschen werden Br&uuml;der,<br /></p><p> Wo dein sanfter Fl&uuml;gel weilt.</p></p><p> </div></p><p> <div class="chor"></p><p> <p>Seit umschlungen Millionen!<br /></p><p> Diesen Ku&szlig; der ganzen Welt!<br /></p><p> Br&uuml;der &uuml;berm Sternenzelt<br /></p><p> Mu&szlig; ein lieber Vater wohnen.</p></p><p> </div></p><p> </div></p><p><div id="vers2"></p><p> <div class="text"></p><p> <p><span class="intitiale">W</span>em der gro&szlig;e Wurf gelungen,<br /></p><p> Eines Freundes Freund zu seyn,<br /></p><p> Wer ein holdes Weib errungen,<br /></p><p> Mische seinen Jubel ein!<br /></p><p> Ja &ndash; wer auch nur eine Seele<br /></p><p> Sein nennt auf dem Erdenrund!<br /></p><p> Und wer&rsquo;s nie gekonnt, der stehle<br /></p><p> Weinend sich aus diesem Bund!</p></p><p> </div></p><p> <div class="chor"></p><p> <p>Was den gro&szlig;en Ring bewohnet,<br /></p><p> Huldige der Sympathie!<br /></p><p> Zu den Sternen leitet sie,<br /></p><p> Wo der Unbekannte thronet.</p></p><p> </div></p><p> </div></p><p> <div id="navigation"></p><p> <ul></p><p> <li><a href="seite2.html">Verse 3 bis 5</a></li></p><p> <li><a href="seite3.html">Verse 6 bis 8</a></li></p><p> <li><a href="http://www.bonneberg.com/index.php?id=57">Weitere Darstellungen</a></li></p><p> </ul></p><p> </div></p><p></div></p><p></body></p><p></html>[/code]</p></blockquote><p></p>
[QUOTE="Hubu300, post: 1491117, member: 195071"] Also ich habe ein Problem..eigentlich habe ich zwei xD... Ich soll für die Uni eine CSS-basierte HP erstellen, die HTML-Datei dürfen wir nicht verändern...so bin auch schon gut vorangekommen denke ich, aber bei mir wollen sich die Boxen einfach nicht verschieben, mit padding klappt es zwar anscheinend, allerdings nur im Programm im Browser sieht es wieder ganz anders aus -.- und mit position bewegt sich gar nichts -.- ich weiß einfach nicht wie ich das hinbekomme =( <<dazugehöriges Layout, #vers1 und 2 sollen eben im Spiegel stehen und die Überschrift auf dem Block...aber wie gesagt es bewegt sich nichts oder komplett flasch [code] body { background-color: #584E3F; background-image: url(design.png); background-repeat: no-repeat; } #wrapper { text-align:left; padding-top:200px; padding-right:0px; padding-bottom:30px; padding-left:580px; } #navigation ul li ul { display: none; } #navigation { padding-bottom:40px; } #navigation a { color: #d5b76c; text-decoration:none; float:left; padding-right:40px; } #vers1 { font-size: 12px; text-align: center; padding-top: 40px; height: 240px; } #vers2 { font-size: 12px; text-align:center; } .chor { font-style: italic; } .intitiale { font-family: "Times New Roman", Times, serif; font-size: 20px; color: #000000; } .text { } h1 { font-family: "Courier New", Courier, monospace; font-size: 40px; font-style: normal; font-weight: bolder; color: #000000; } [/code][code] <?xml version="1.0" encoding="ISO-8859-1"?> <!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>Ode an die Freude · Friedrich Schiller</title> <link href="ode.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="wrapper"> <h1>An die Freude.</h1> <div id="vers1"> <div class="text"> <p><span class="intitiale">F</span>reude, schöner Götterfunken,<br /> Tochter aus Elisium,<br /> Wir betreten feuertrunken,<br /> Himmlische, dein Heiligthum.<br /> Deine Zauber binden wieder,<br /> Was die Mode streng getheilt,<br /> Alle Menschen werden Brüder,<br /> Wo dein sanfter Flügel weilt.</p> </div> <div class="chor"> <p>Seit umschlungen Millionen!<br /> Diesen Kuß der ganzen Welt!<br /> Brüder überm Sternenzelt<br /> Muß ein lieber Vater wohnen.</p> </div> </div> <div id="vers2"> <div class="text"> <p><span class="intitiale">W</span>em der große Wurf gelungen,<br /> Eines Freundes Freund zu seyn,<br /> Wer ein holdes Weib errungen,<br /> Mische seinen Jubel ein!<br /> Ja – wer auch nur eine Seele<br /> Sein nennt auf dem Erdenrund!<br /> Und wer’s nie gekonnt, der stehle<br /> Weinend sich aus diesem Bund!</p> </div> <div class="chor"> <p>Was den großen Ring bewohnet,<br /> Huldige der Sympathie!<br /> Zu den Sternen leitet sie,<br /> Wo der Unbekannte thronet.</p> </div> </div> <div id="navigation"> <ul> <li><a href="seite2.html">Verse 3 bis 5</a></li> <li><a href="seite3.html">Verse 6 bis 8</a></li> <li><a href="http://www.bonneberg.com/index.php?id=57">Weitere Darstellungen</a></li> </ul> </div> </div> </body> </html>[/code] [/QUOTE]
Bilder bitte
hier hochladen
und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Zitate einfügen…
Authentifizierung
Wenn ★ = 12, ◇ = 4 und die Hälfte von ★ zu ◇ addiert wird, was ist das Ergebnis?
Antworten
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
Webdesign: HTML/CSS, Responsive Design, Sass...
CSS-HP, positionierung klappt nicht
Oben