Hallo, Gast! (Registrieren)

Wir wünschen allen Besuchern frohe Ostern!

Letzte Ankündigung: MyBB 1.8.37 veröffentlicht (04.11.23)


Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste
Feststehende Navigationsleiste oben -> Probleme mit Listen
#1
Hallo,

ich habe eine feststehende obere Navigationsleiste eingeführt. Der CSS-Code (aus einem Webdesign-Forum erhalten) enthält folgendes:

* {
 margin: 0;
 padding: 0;
}

Das funktioniert für die Leiste auch schön, ich habe jedoch festgestellt, dass sämtliche Listen im Forum dadurch an den linken Rand gerutscht sind.

Hat jemand eine Idee, wie man diesen Konflikt lösen kann?
Zitieren
#2
Nimm doch eine andere Klasse oder Id für die Listengestaltung.. Wie sieht denn der gesamte Navi Code überhaupt aus ?
Mit freundlichen Grüßen

MrBrechreiz
Zitieren
#3
Ich bin in CSS leider überhaupt nicht fit, was müsste ich konkret tun ?

a) Hier der CSS-Code der Leiste:

Code:
/* Ein kleiner Reset der Default-Anweisungen im Browser */

* {
margin: 0;
padding: 0;
}

.navbar {
background-color: #ffffff;
color: #666666;
line-height: 45px;  /* Hängt von der Höhe der Navbar ab, hilft aber enorm. */
margin: 0;
padding: 4px 15px 4px 5px;
position: fixed;
top: 0;
right: 0;
left: 0;
border-bottom:1px solid #666666;
box-shadow: 5px 5px 10px #e6e6e6;
}

/* Hier erstmal den Container für Titel und Logo nach Links schieben. */

.brand {
float: left;
}

/* Durch die nächste Anweisung stehen Logo und Seitentitel nebeneinander. */

.brand .logo,
.brand .my_oberzeile_seitenname {
display: inline-block;
vertical-align: middle;
}

/* Jetzt zum Menü, schieben wir es erstmal nach rechts. */

.nav_oben {
float: right;
}

/* Und jetzt noch ein paar Styles für die Links. */

.nav_oben a {
text-decoration: none;
}

.nav_oben a:hover {
border-bottom: 3px solid
}

.my_oberzeile_seitenname {
    font: bold 25px Arial;  
        font-color: #666666;
}

.my_oberzeile_seitenname a {
    color: #666666;
    text-decoration: none;
}


b) HTML:

Code:
<div class="navbar">

  <div class="brand">
   <div class="logo"><a href="{$mybb->settings['bburl']}/"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" width="40" title="{$mybb->settings['bbname']}" /></a></div>  

  <!-- Der Seitentitel sollte mit einem H1 ausgezeichnet
           werden, damit er aus semantischer Sicht sofort erkannt wird. -->
    <h1 class="my_oberzeile_seitenname">
<a href="{$mybb->settings['bburl']}/">....de</a></h1>
  </div>

  <!-- Für einfache Navigationen (eine Menüebene),
        genügen Links in einem nav Element, nav
        kommt von Navigation.
-->

  <nav class="nav_oben">

Button 1
Button 2
..

  </nav>

</div>
Zitieren
#4
Kann man sich deine Seite mal näher betrachten, wo die Navi zu sehen ist ?
Mit freundlichen Grüßen

MrBrechreiz
Zitieren
#5
Dies bitte löschen

Code:
* {
margin: 0;
padding: 0;
}

Diese Klasse

Code:
.navbar {
background-color: #ffffff;
color: #666666;
line-height: 45px; /* Hängt von der Höhe der Navbar ab, hilft aber enorm. */
margin: 0;
padding: 4px 15px 4px 5px;
position: fixed;
top: 0;
right: 0;
left: 0;
border-bottom:1px solid #666666;
box-shadow: 5px 5px 10px #e6e6e6;
}

abändern zu das

Code:
.navbar {
background-color: #ffffff;
color: #666666;
line-height: 40px;  /* Hängt von der Höhe der Navbar ab, hilft aber enorm. */
margin: 0;
height: 45px;
padding: 4px 15px 4px 5px;
position: fixed;
top: 0;
right: 0;
left: 0;
border-bottom:2px solid #a4a4a4;
box-shadow: 5px 5px 10px #e6e6e6;
}


Diese Klasse

Code:
.my_oberzeile_seitenname a {
color: #666666;
text-decoration: none;
}

ändern zu

Code:
.my_oberzeile_seitenname a {
color: #666666;    
text-decoration: none;
line-height: 17px;
}


Hoffe das es nun bei dir funktioniert.
Mit freundlichen Grüßen

MrBrechreiz
Zitieren
#6
Ja, das sieht auf den ersten Blick bestens aus. Vielen Dank, MrBrechreiz !
Zitieren


Möglicherweise verwandte Themen…
Thema Verfasser Antworten Ansichten Letzter Beitrag
  Listen Punkte in Zweitdesigns nicht vorhanden queenie 3 1.395 28.02.2019, 17:42
Letzter Beitrag: StefanT
  Hilfe ! Mobiles Theme zerstört Listen falcao1010 14 4.071 29.11.2016, 16:53
Letzter Beitrag: MrBrechreiz
  NAvigationsleiste falsch gecoded Speedmaster 7 1.874 23.03.2013, 22:18
Letzter Beitrag: MrBrechreiz
Question Zusätzliche feste Navigationsleiste einbinden Weihnachts-Lichter 5 2.141 26.12.2012, 11:30
Letzter Beitrag: Weihnachts-Lichter
  Mybb - Navigationsleiste Urzsa 5 2.485 24.05.2011, 16:51
Letzter Beitrag: Devidra