Auf Thema antworten 2026

Beitrag

<blockquote data-quote="moppi" data-source="post: 2495778" data-attributes="member: 670649">Hallo allerseits,vielleicht hätte ich dazu schreiben sollen, dass ich dieses Layout nach Möglichkeit ohne Hintergrundbilder und auch ohne Tabellen umsetzen möchte.Im Moment siehts so aus:Alles was rot ist, muss noch blau werden.Hier der auch mal vorläufige Code:[html]&lt;!doctype html&gt;&lt;html&gt;&lt;head&gt;&lt;meta charset=&quot;utf-8&quot;&gt;&lt;title&gt;Unbenanntes Dokument&lt;/title&gt;&lt;style type=&quot;text/css&quot;&gt;nav {background-color: #9d9d9c;height: auto;margin: 0;padding: 0;width: 100%;}nav ul {height: 40px;margin: 0 auto;width: 680px;padding: 0;}nav ul li {float: left;height: 36px;list-style: none;width: 170px;}nav ul li a {color: #fff;background-color: #9d9d9c;display: block;font-size: 18px;margin: 0 0 0 30px;padding: 8px 0 5px 18px !important;text-decoration: none;text-transform: uppercase;}nav ul li:first-child {border-top: 11px solid #51c4f1;}nav ul li:nth-child(2) {border-top: 11px solid #a2c74a;}nav ul li:nth-child(3) {border-top: 11px solid #f8ea1b;}nav ul li:nth-child(4) {border-top: 11px solid #c0bfbf;}nav ul li:first-child:hover a {background-color:#51c4f1;height:50px;}nav ul li:nth-child(2):hover a {background-color:#a2c74a;}nav ul li ul li:nth-child(2):hover a {background-color:#51c4f1;}nav ul li:nth-child(3):hover a {background-color:#f8ea1b;}nav ul li ul li:nth-child(3):hover a {background-color:#51c4f1;}nav ul li:nth-child(4):hover a {background-color:#c0bfbf;}nav ul li ul {background:#51c4f1;height: 29px;margin: 0 auto;padding:0 0 0 170px;width: 540px;visibility: hidden;}nav ul li:hover &gt; ul {visibility: visible;display:block;z-index:1000;}nav ul li ul li {float: left;list-style: none;width: 170px;border: none !important;margin-top: -10px;}nav ul li ul li a{height:25px !important;padding: 3px 0 -25px 18px!important;}nav ul li ul li a:hover{color: #000;}&lt;/style&gt;&lt;/head&gt;&lt;body&gt;&lt;nav&gt;&lt;ul&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;LINK&lt;/a&gt;&lt;ul&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;LINK&lt;/a&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;LINKLINK&lt;/a&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;LINKLINKLINK&lt;/a&gt;&lt;/ul&gt;&lt;/li&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;LINK&lt;/a&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;LINKLINK&lt;/a&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;LINKLINKLINK&lt;/a&gt;&lt;/ul&gt;&lt;/nav&gt;&lt;/body&gt;&lt;/html&gt;[/html]Ich hab das ganze mal als Code geändert - Dobi78[USER=461755]@Dobi78[/USER]Danke!</blockquote>

[QUOTE="moppi, post: 2495778, member: 670649"] Hallo allerseits, vielleicht hätte ich dazu schreiben sollen, dass ich dieses Layout nach Möglichkeit ohne Hintergrundbilder und auch ohne Tabellen umsetzen möchte. Im Moment siehts so aus: Alles was rot ist, muss noch blau werden[I].[/I] Hier der auch mal vorläufige Code: [html]<!doctype html> <html> <head> <meta charset="utf-8"> <title>Unbenanntes Dokument</title> <style type="text/css"> nav { background-color: #9d9d9c; height: auto; margin: 0; padding: 0; width: 100%; } nav ul { height: 40px; margin: 0 auto; width: 680px; padding: 0; } nav ul li { float: left; height: 36px; list-style: none; width: 170px; } nav ul li a { color: #fff; background-color: #9d9d9c; display: block; font-size: 18px; margin: 0 0 0 30px; padding: 8px 0 5px 18px !important; text-decoration: none; text-transform: uppercase; } nav ul li:first-child { border-top: 11px solid #51c4f1; } nav ul li:nth-child(2) { border-top: 11px solid #a2c74a; } nav ul li:nth-child(3) { border-top: 11px solid #f8ea1b; } nav ul li:nth-child(4) { border-top: 11px solid #c0bfbf; } nav ul li:first-child:hover a { background-color:#51c4f1; height:50px; } nav ul li:nth-child(2):hover a { background-color:#a2c74a; } nav ul li ul li:nth-child(2):hover a { background-color:#51c4f1; } nav ul li:nth-child(3):hover a { background-color:#f8ea1b; } nav ul li ul li:nth-child(3):hover a { background-color:#51c4f1; } nav ul li:nth-child(4):hover a { background-color:#c0bfbf; } nav ul li ul { background:#51c4f1; height: 29px; margin: 0 auto; padding:0 0 0 170px; width: 540px; visibility: hidden; } nav ul li:hover > ul { visibility: visible; display:block; z-index:1000; } nav ul li ul li { float: left; list-style: none; width: 170px; border: none !important; margin-top: -10px; } nav ul li ul li a{ height:25px !important; padding: 3px 0 -25px 18px!important; } nav ul li ul li a:hover{ color: #000; } </style> </head> <body> <nav> <ul> <li><a href="#">LINK</a> <ul> <li><a href="#">LINK</a> <li><a href="#">LINKLINK</a> <li><a href="#">LINKLINKLINK</a> </ul> </li> <li><a href="#">LINK</a> <li><a href="#">LINKLINK</a> <li><a href="#">LINKLINKLINK</a> </ul> </nav> </body> </html>[/html] [COLOR=#ff4d4d]Ich hab das ganze mal als Code geändert - Dobi78[/COLOR] [COLOR=#ff4d4d][USER=461755]@Dobi78[/USER] Danke![/COLOR] [/QUOTE]

Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.

Authentifizierung

Wenn ▲ = 7, ▼ = 3, ◇ = 2 und die Summe von ▲ und ▼ durch ◇ geteilt wird, was ist das Ergebnis?