Abstände zwischen menu und submenue

[musikos]

Hallo

wie vergrössere ich den Abstand innerhalb eines Menues?


Hab eigentich alles probiert mit margin, padding usw.
Immer wenn ich da etwas ändere (also auch bei level2 menue) verschiebt es die obere Zeile mit, die soll aber fix bleiben.

Ist es so, dass ich eine 2. Navi als Submenue erstellen muss, um dieses frei positionieren zu können?
Das erscheint mir momentan der einzigste Weg

www.vinuesa.de/vinuesa

[derRenner]

Hallo,

bin mir nicht sicher, ob ich das Problem korrekt verstanden habe, aber sprich mal die ul wie folgt an:

.mod_navigation ul.level_2 { margin-top:20px; }

... dann ist mir noch ein Fehler im Inhalt aufgefallen
unter 'vita' » "Die Künstlering Maria Vinuesa"

[kos]

Hallo Fritz,

zunächst möchte ich dich bitten, Fragen nicht per PM zu stellen, sondern einen entsprechenden Beitrag im Forum zu verfassen.

So wird dir oft schneller geholfen, denn diejenigen, die sich bereit finden, im Forum zu helfen, warten ja nun nicht gerade ständig darauf, dass jemand ihre Dienste benötigt.

Nun, ich habe jetzt mal Zeit gefunden, mich mit deinem Problem zu beschäftigen und möchte dir folgendes CSS vorschlagen

/* Reset soweit für Menü erforderlich*/
.mod_navigation,
.mod_navigation ul,
.mod_navigation li{
  position:static;
  top:0;
  left:0;
  margin:0;
  padding:0;
  float:none;
  width:auto;
  height:auto;
}
.mod_navigation ul li *{
    border: none;
    border-radius:0;
}


/* neues CSS */
.mod_navigation {
  position:absolute;
  top:161px;
  padding: 0 11px;
}
.mod_navigation ul{
  display:inline-block;
  list-style:none;
  text-align:center;
  height: 80px;
}
.mod_navigation li {
  display: inline-block;
  text-align: center;
}
.mod_navigation li a, .mod_navigation li span {
  display: inline-block;
  padding: 0 33px;
  height:auto;
}
.mod_navigation .level_2 {
  margin: 0 auto;
  position: absolute;
  top: 38px;
  width: 800px;
}
.mod_navigation .level_2 li a,
.mod_navigation .level_2 li span {
    background-color: rgba(19, 49, 83, 0.75);
    border: 1px solid #133353;
    border-radius: 10px;
    box-shadow: 5px 5px 5px 3px rgba(19, 51, 83, 0.5);
    color: #e9a85c;
}
.mod_navigation li a:hover,
.mod_navigation li span.active {
    color: #fff;
}

Eventuelle Fremdeffekte aus dem bereits vorhandenen CSS sind aber möglich, da würde ich an deiner Stelle nochmal nachkontrollieren und auch mal die Redundanzen entfernen.

Hier das Ergebnis

[musikos]

Danke Karl

Wahnsinn, wie geht das, dass du davon gleich ein jepg erstellen kannst?

Also da wo neues css steht, das ist von dir

und das darüber war noch von mir?

Mein Problem ist, dass obwohl ich die Grundbegriffe von css weiss, es trotzdem oft try and error bei mir ist

Gruss
Fritz

@Bernhard
Deinen Vorschlag hab ich schon probiert
und das G auch schon entdeckt - wollte es demnächst korrigieren

[musikos]

wenn ich mir das css file anschaue
<link rel="stylesheet" href="assets/css/42f1765f89c1.css">
finde ich es unheimlich aufgeblasen

was ist denn da alles drin?
z.B. was ist .mejs für ne Klasse
das hab ich doch nie angelegt
auch motools Sachen hab ich nicht verwendet
oder .chzn ?
auch Table hab ich nicht verwendet.

Wird da einfach lauter Zeug schon mal vorsorglich reingeschrieben in das css file, ungeachtet dessen ob es gebraucht wird oder nicht?

[MiTsch]

Hallo musikos,

Du musst doch auch Zugang zu dem css sheet haben, um meine fehler korrigieren zu können???

Nein muss er nicht. Das Zauberwort heißt Firebug !

Du kannst, das kostenlose Addon Firebug für den Webbrowser Firefox für so etwas nutzen.
Damit lassen sich dann leicht die Zusammenhänge in deiner Webseite analysieren und Du kannst damit dann den richtigen Selector bestimmen.

Eventuell hilft Dir diesbezüglich auch dieses Tutorial weiter.
Btw. was Dir eventuell den Einstieg in Contao noch erleichtern könnte wären folgende Links:

1. Installation,
2. Backend,
3. Gundlagen,
4. Handbuch,
5. Einsteiger

Viele Grüße
MiTsch

Edit: Bitte lösche keine Beiträge da so der Zusammenhang verloren geht und es evtl. andere aus der Community mit dem gleichen Problem erschwert wird einen möglichen Lösungsweg nachzuvollziehen.

[musikos]

Hallo Mitsch

ja klar, ich hab nicht an den Firebug gedacht. Mit dem sieht man es freilich. benutze ich ja selber.
Ich hab auch schon zwei verschiedene Tuts durchgearbeitet.

Gelöscht hab ich nicht den Post, nur den Inhalt und durch einen anderen Inhalt ersetzt.

@ Karl
ich würde gerne auch für die Zukunft verstehen, was da der Schlüssel ist, um das Submenue vom Hauptmenue abzusetzen (für zukünftige Webseiten)bzw. was ich da falsch gemacht habe. (das mit den Redundanzen ist auch noch so eine Sache, ich habe gemerkt, dass ich öfters doppelt gemoppelt habe :-)
ich meine ich kanns auch einfach übernehmen, aber will es gerne wissen für die Zukunft.

Gruss und Danke für eure Mühen, besonders Dir Karl.

[tab]

Eigentlich recht einfach. Die verschiedenen Ebenen der Navigation werden durch die Klassen "level_1, level_2, ..." gekennzeichnet, die der jeweiligen unsortierten Liste (ul) zugewiesen wird. Was du als Hauptmenü bezeichnest wäre also über den Selektor ul.level_1 oder auch .mod_navigation ul.level_1 anzusprechen, das "Submenü" über ul.level_2 oder auch .mod_navigation ul.level_2 usw. In deinem aktuellen Fall ist bei level_2 Schluss. Sieht man ja auch im Quelltext wie die Navigation aufgebaut ist.

[ciaobello]

Gelöscht hab ich nicht den Post, nur den Inhalt und durch einen anderen Inhalt ersetzt.

Wieso Streichst Du denn dass Überflüssig nicht einfach Durch
und ergänzt das neue? (Icon ABC)

Oder schreibst

Anmerkung/Ergänzung:
Und machst Deine Ergänzung.

Du kannst dich selber (und andere) Zitieren ... (Icon Sprechblase)

Weil wenn Du es nicht so machst, fangen die Leute wieder an Deine Beiträge voll zu Zitieren (Damit sie sichergehen dass Du nichts abänderst). Wenn dann mal was falsches raus rutscht, oder was falsch geschrieben ist kannst es im Zitat nicht mehr Korrigieren

[musikos]

@tab

verstanden, Danke