Ausrichtung eines CSS-Dropdown-Menüs - Frage

Begonnen von breakdancer, 06 März 2010, 22:29:17

⏪ vorheriges - nächstes ⏩

0 Mitglieder und 1 Gast betrachten dieses Thema.

breakdancer

Hi,

bei dem von mir verwendeten CSS-Dropdown-Menü sind die Menüs so ausgerichtet, dass wenn die Dropdowns herunterfallen, die textmäßig linksbündig angeordnet sind.

Aus Gründen der Seitenbreite benötige ich beim letzten Menüpunkt nun eine Umstellung und zwar so, dass die Felder im Dropdown textmäßig rechtsbündig abschliessen sollen.

Zur Verdeutlichung:

So sieht es derzeit aus:

|OBERMENÜ|
|DROPDOWNFELD 1 LINKSBÜNDIG|
|DROPDOWNFELD 2 LINKSBÜNDIG|
|DROPDOWNFELD 3 LINKSBÜNDIG|

Und so soll es ausschauen:

                                   |OBERMENÜ|
|DROPDOWNFELD 1 RECHTSBÜNDIG|
|DROPDOWNFELD 2 RECHTSBÜNDIG|
|DROPDOWNFELD 3 RECHTSBÜNDIG|

Die entsprechenden .classes für das Div habe ich schon angelegt - jetzt probiere ich hier aber dauernd rum und kriege die Formatierung nicht hin. Hab die .css Dokumentation durchgeschaut, ich erwisch nicht das Richtige.

Frage: welcher .css-Befehl ist denn für die genannte Einstellung verantwortlich ?

Liebe Grüße

Markus

martin b

Hallo Markus

Zunächst müßte man mal wissen, welche Software du verwendest. Ich kenne den CSS Dropdownmenue Maker von WonderWebWare und da werden die Einstellungen in der style.css und in der style_files.xml vorgenommen. Welche classes verwendet werden kannst du im Prinzip einfach daran feststellen, das dort float: left; steht. für das eine Teil, wo es rechtsbündig sein soll mußt du dann entsprechend eine eigene class anlegen z.B. anstelle von "._MMCLASS_{" also  "._MMCLASS1_{"  (das ist das Teil für das Main Menue, z.B. Home) und darin änderst du es dann in float: right;

Zudem mußt du dann die Classes dem einzelnen Menue zuordnen.

Ich hoffe, das hilft dir schon mal weiter.

Gruß
martin b

breakdancer

Morgen Martin  ;)

es hilft gar nicht wirklich, hab mit dem float-Attribut überall mal bisschen rumgespielt - das einzige was passiert ist, ist dass die Menüeinträge des Dropdown jetzt nebeneinander gestanden haben.  :BD:

Zur Verwendung kommt das Theme RD-BlackRed von Radium Designs.

Das Problem ist - wie gesagt - nicht das neue definieren einer eigenen Class - das ist soweit alles fertig und ich kann den einen Menüpunkt nun auch schon unabhängig steuern, funktioniert also, nur das mit dem float klappt einfach gar nicht.

Ich poste mal den entsprechenden Abschnitt aus der rd_template.css, die für diese Formatierungen im Menü zuständig ist. Die .dropmenudivpartner ist schon die eigens für diesen Menüabschnitt angelegte .class.

.dropmenudivpartner
{
        position:absolute;
        top:0;
        float:right;
        display:block;
        visibility:hidden;
        border:0 #FDB300;
        background:#000;
        color:#000;
        z-index:100;
        text-decoration:none;
        padding:0;
}

.dropmenudivpartner ul
{
        list-style:none;
        margin:0;
        padding:0;
}
.dropmenudivpartner li
{
        display:inline;
        margin:0;
        padding:0;
}
.dropmenudivpartner a:link,.dropmenudiv a:visited
{
        width:150px;
        display:block;
        border:0;
        color:#000;;
        font-weight:normal;
        font-style:normal;
        text-decoration:none;
        margin:0;
        padding:0;
}
.dropmenudivpartner a span
{
        display:block;
        line-height:25px;
        background-color:#000;
        font-family:Tahoma,century gothic,Georgia,  sans-serif;
        font-size:10px;
        color: #E8E8E8;
        border-bottom: 1px solid #666;
        border-left: 1px solid #666;
        border-right: 1px solid #666;
        float:none;
        padding:0 12px;
}
.dropmenudivpartner a:hover
{
        border:0 #FF9300;
        background-position:left bottom;
        font-weight:normal;
        font-style:normal;
        text-decoration:none;
        color:#CCC;
}
.dropmenudivpartner a:hover span
{
        background-position:left bottom;
        background-color:#333;
        color:#CCC;
        font-weight:normal;
}


Hilf das weiter ? Ich lass das Theming soweit einfach mal bis heute Nachmittag zum Anschauen online stehen: http://www.circusmania.de

Es geht um das Menü "Partner" ganz rechts oben.

Liebe Grüße

Markus

pekobe

Hallo,

ich würde es mir ja anschauen, aber irgendwie klappt das mit den Downloads nicht.
Der will immer irgendwelche Logindaten haben, nur wenn ich mir hier schon die Vorschau
anschauen möchte.


LG Sven

breakdancer

Hallo Sven,

ist bekannt... Für den Download musst Du bei Radium Designs angemeldet sein, das ist vom Verfasser der Themes so gewünscht.

Wie gesagt, anschauen kannst Du es Dir ja derzeit auf der o. g. Website, es ist heute schonmal aktiv.

Liebe Grüße

Markus

martin b

Hallo Markus

Ich habe mir die Seite mal angesehen. Die Ausrichtung des Textes in den Submenues unter Partner behebt nicht das Problem, denn die Breite bliebe unverändert. Was du ändern mußt, ist die Breite.

Gruß
martin b

breakdancer

Hallo Martin,

danke für Deine Hilfe - nur genau das will ich eben nicht - die Seitenbreite soll unbedingt bleiben wie sie ist. Es geht auch nicht um die Ausrichtung des Textes, klar, dann bleibt alles wie es ist -  sondern um die Ausrichtung der gesamten Menüfelder im Dropdown Menü. Eben rechts- und nicht mehr linksbündig. Siehe oben.

Deswegen versuche ich ja, einfach das letzte Menü rechtsbündig per getrennter .class anzulegen - muss doch durch css zu machen sein, oder vielleicht kann ich auch das entsprechende DIV in der theme.html einfach rechtsbündig anordnen - fällt mir grad mal so ein... Muss ich mal nachschlagen.

Liebe Grüße

Markus

martin b

Hi Markus

Ich glaube, du hast mich falsch verstanden. Du sollst nicht die Breite der Seite ändern, sondern die Breite der Submenues unter Partner. Oben im Code hast du folgendes drin:
width:150px;

ändere den Wert mal auf 120px und schau mal, wie es dann aussieht.

Gruß
martin b

breakdancer

Ah, jetzt hab ich Dich verstanden, sorry... :)

Habs mal abgeändert, passiert is auch nach PMX-Cache und Browsercache löschen gar nix. Ist auch bissl fies, da ja in die Partnerlinks z. T. recht lange Texte reinmüssen, da kann ich nicht wesentlich kürzen, leider...

Liebe Grüße

Markus

martin b

Hi
Du kannst die Partnerlinks auch wo anders in der Navi unterbringen und etwas anderes nach rechts außen setzen. Leider hast du das Template umgestellt, so das ich da nicht mehr nachschauen kann. Aber es gibt (gab) einen Menuepunkt, inmit nur einen, ganz kurzen Unterpunkt. Da kämst du sogar mit einer Breite unter 100px aus.

Gruß
martin b

breakdancer

Hi,

Theme is wieder online. Im Prinzip hast Du Recht, aber der Untepunkt "Liens" wird noch ausgetauscht gegen echte Module - und da wird die Beschreibung wieder mehr als 5 Zeichen haben.

Ich mach´s mir jetzt mal viel einfacher und werde eventuell den Menüpunkt "Forum" unter "Interaktiv" einordnen - so dass ein Obermenü komplett wegfallen kann. Dann reicht es halt auch wieder.

Liebe Grüße

Markus

martin b

Hallo Markus
Das Dropdownmenue ist mit dem Chrome Dropdown Menue Maker realisiert und wurde in das Theme integriert. Soweit ich das auf die Schnelle sehen konnte, wurde die für die Konfiguration entscheidende CSS Datei nicht mit in das Theme übernommen. Du kannst aber hier mal schauen und dir mit der Software selber ein Dropdonmenue erstellen: http://www.dynamicdrive.com

Die Info steht übrigens in der JS Datei im Ordner "Chrome".

Gruß
martin b