Beiträge

huift nix ..

nutze MenuCSSCount - kann es damit was zu tun haben?

Vermutlich habt ihr einmal euren Browser geschlossen ohne euch vorhin abzumelden - dann ist quasi der Inhaltbereich noch unter Bearbeitung fürs CMS und kann deshalb nicht aufgerufen werden -

auf der ersten seite im Backend (Infoseite) lässt sich das mit dem Button "andere User abmelden" beheben

So meine Lieben,


hoffentlich vorerst das letzte mal das ich euch auf den Wecker gehe - ich habe mir auch schon fest vorgenommen der MoziloGemeinde ein Template zu sponsern sobald ich mein Job hier fertig habe ..


Nun habe ich noch ein Problem was ich nicht zu lösen vermag - und zwar funktioniert mein Dropdown Menü nur wenn ich mich in der selbigen Kategorie befinde - sprich wenn ich nicht in dieser bin und mit der Maus über den Bereich fahre worauf das Dropdownmenü aufklappen sollte passiert niente ..

http://www.zwicknagel-fahrraeder.de/beta

Navicode:

Code Auswählen Erweitern



mainmenu {


    width: auto;

}





ul.mainmenu {
    padding: 2px;
margin-top: 0px;
    margin-left: 25px;


 
}


  ul.mainmenu:after {
    clear: both;
    content: " ";
    display: block;
    font-size: 0;
    height: 0;
    visibility: visible;
}



/*Mainmenu*/

ul.mainmenu li.mainmenu1 {
    list-style: none;
    float:left;
margin: 0px;
padding: 0px;
    border-right: 1px solid #dfdfdf;
}
ul.mainmenu li.mainmenu2 {
    list-style: none;
    float:left;
margin: 0px;
padding: 0px;
    border-right: 1px solid #dfdfdf;
}
ul.mainmenu li.mainmenu3 {
    list-style: none;
    float:left;
margin: 0px;
padding: 0px;
    border-right: 1px solid #dfdfdf;
}
ul.mainmenu li.mainmenu4 {
    list-style: none;
    float:left;
margin: 0px;
padding: 0px;
    border-right: 1px solid #dfdfdf;
}
ul.mainmenu li.mainmenu5 {
    list-style: none;
    float:left;
margin: 0px;
padding: 0px;
    border-right: 1px solid #dfdfdf;
}


/*a.menuactive*/

ul.mainmenu li.mainmenu1 a.menuactive {

color: white;

}
ul.mainmenu li.mainmenu2 a.menuactive {

color: white;

}
ul.mainmenu li.mainmenu3 a.menuactive {

color: white;

}
ul.mainmenu li.mainmenu4 a.menuactive {

color: white;

}
ul.mainmenu li.mainmenu5 a.menuactive {

color: white;

}


/*Schriftart Menu*/

ul.mainmenu li.mainmenu1 a {

font-family: Corbel, Arial, Helvetica, sans-serif;
    text-decoration: none;
font-size: 1.2em;
font-weight: bold;
    display: block;
    color: #151616;
    padding: 16px 28px 14px 28px;

    transition: background 0.3s ease-out; /* explorer 10 */
    -webkit-transition: background 0.3s ease-out; /* chrome & safari */
    -moz-transition: background 0.3 ease-out; /* firefox */
    -o-transition: background 0.3 ease-out; /* opera */
}
ul.mainmenu li.mainmenu2 a {


font-family: Corbel, Arial, Helvetica, sans-serif;
    text-decoration: none;
font-size: 1.2em;
font-weight: bold;
    display: block;
    color: #151616;
    padding: 16px 28px 14px 28px;

    transition: background 0.3s ease-out; /* explorer 10 */
    -webkit-transition: background 0.3s ease-out; /* chrome & safari */
    -moz-transition: background 0.3 ease-out; /* firefox */
    -o-transition: background 0.3 ease-out; /* opera */
}
ul.mainmenu li.mainmenu3 a {

font-family: Corbel, Arial, Helvetica, sans-serif;
    text-decoration: none;
font-size: 1.2em;
font-weight: bold;
    display: block;
    color: #151616;
    padding: 16px 28px 14px 28px;

    transition: background 0.3s ease-out; /* explorer 10 */
    -webkit-transition: background 0.3s ease-out; /* chrome & safari */
    -moz-transition: background 0.3 ease-out; /* firefox */
    -o-transition: background 0.3 ease-out; /* opera */
}
ul.mainmenu li.mainmenu4 a {

font-family: Corbel, Arial, Helvetica, sans-serif;
    text-decoration: none;
font-size: 1.2em;
font-weight: bold;
    display: block;
    color: #151616;
    padding: 16px 28px 14px 28px;

    transition: background 0.3s ease-out; /* explorer 10 */
    -webkit-transition: background 0.3s ease-out; /* chrome & safari */
    -moz-transition: background 0.3 ease-out; /* firefox */
    -o-transition: background 0.3 ease-out; /* opera */
}
ul.mainmenu li.mainmenu5 a {

font-family: Corbel, Arial, Helvetica, sans-serif;
    text-decoration: none;
font-size: 1.2em;
font-weight: bold;
    display: block;
    color: #151616;
    padding: 16px 28px 14px 28px;

    transition: background 0.3s ease-out; /* explorer 10 */
    -webkit-transition: background 0.3s ease-out; /* chrome & safari */
    -moz-transition: background 0.3 ease-out; /* firefox */
    -o-transition: background 0.3 ease-out; /* opera */
}


/*Hover Menu*/

ul.mainmenu li.mainmenu1:hover > a {
    color: white;
background-color: #ff6100;

}
ul.mainmenu li.mainmenu2:hover > a {
    color: white;
background-color: #5782aa;

}
ul.mainmenu li.mainmenu3:hover > a {
    color: white;
background-color: #95d310;

}
ul.mainmenu li.mainmenu4:hover > a {
    color: white;
background-color: #004C66;;

}
ul.mainmenu li.mainmenu5:hover > a {
    color: white;
background-color: #ff6100;

}



/*Detailmenu*/




ul li ul.detailmenu li.detailmenu:hover > a
{
    color: white;
width: auto;
background-color: #transparent;
}
ul li:hover >  ul
{
    visibility: visible;
}



ul li ul
{
   
    visibility: hidden;
    position: absolute;
    padding:0px;
margin: 0 auto;
list-style: none;
text-decoration: none;
font-size: 1.2em;
font-weight: bold;
   
width: auto;
    color: #151616;
    padding: 2% 5%;
background-color: #95d310;

   
}
ul li ul li
{
float: left;
width:auto;
padding: 0px;
    border-right: 1px solid #dfdfdf;

}











Desweiteren mühe ich mich etwas mit "repsonsive" Design ab, und zwar reicht es bei mir aus irgend einem Grund nicht nur
width bzw max-width anzugeben, sondern muss ich auch noch mühsam die höhe fürs jeweilige Gerät angeben ..  ansonsten sieht es so aus:




Also sollte jemand dafür die Lösung wissen und es nur an einer Kleinigkeit liegt wie die letzten Male - traumhaft!



vG,

an die bar

... ahhh

ne nicht ganz - span.rightcontentimage hat nur overflow:hidden und schneidet das Bild ab und zeigt es nicht vollständig, während contentimage das Bild an die Größe anpasst und vollständig gezeigt wird


.. aber da ich contentimage ein flow mitgegeben habe ist es zumindest zweckerfüllend

Hallo Thorsten,


danke für die Antwort !

Mit den Bildern habt ihr natürlich absolut recht, ich werde in Zukunft strenger zu meinen Kunden sein !

Mit dem für User beschränkten Backend von mozilo CMS haben sie im Vergleich zu Joomla/Wordpress eh schon ein fast sorgenfreies Webseitenleben


Bzgl des Problems mit contentimage / rightcontentimage ist mir klar das diese jeweils auf die passende css greift

- was ich meine/meinte ist dass wenn du dir z.B. diese Inhaltseite ankuckst : http://www.zwicknagel-fahrraeder.de/beta/Kategorie.html kann man sehen dass sich das Bild bei dem Befehl "Bild" richtig skaliert während es bei "Bildrechts" über mein Content Div laufen würde bzw jetzt im Fall durch overflow: hidden versteckt wird

Code Auswählen Erweitern

/* [bildrechts|...] */
span.rightcontentimage {

    float:right;
border: solid;
margin-top: 0px;
margin-right: 55px;
overflow: hidden;
max-height: 540px;
max-width: 600px;



}



/*Bild*/
img.contentimage {

border: solid;
margin-left: 5%;
margin-right: 5%;
margin-top: 20px;

max-width: 40%;
max-height: 100%;

float: left;
clear: both;



}



vG

Hihi ja vieleicht - ich hab jetzt mal notdürftig mit

Code Auswählen Erweitern

overflow: hidden; "gelöst" -

allerdings ist mir aufgefallen das beim mozilo Syntax

[bild|@=Kategorie:SAM_5870.jpg=@]

es durchaus wie gewohnt

Code Auswählen Erweitern

/*Bild*/
img.contentimage {

border: solid;
margin-left: 550px;
margin-top: 0px;
width: 45%;


}funktioniert, ich mir aber nicht erklären kann wieso - liegt es am span?



und ja ich werde bei Übergabe auf jedenfall noch ein CrashKurs in Bildgrößen anpassen geben



VG andi.ebar

Hm,

das ist natürlich eine simple Lösung jedoch bin ich mir nicht sicher ob ich das meinen Kunden auch zutrauen kann wenn er neue Bilder in nem Jahr hochladen möchte ..


VG,
andi.ebar

Hallo Community,


nachdem meine letzte Frage so prompt erfolgreich beantwortet wurde bitte ich ganz dreist nochmal um Hilfe


Und zwar kriege ich es irgendwie nicht gebacken dass Bilder im Content die gewünschte Größe erhalten trotz meiner Meinung nach richtiger CSS - zu sehen hier:  [url=http://www.zwicknagel-fahrraeder.de/beta/]http://www.zwicknagel-fahrraeder.de/beta/[/url]  soll so aussehen : http://www.zwicknagel-fahrraeder.de (hier mit DIV geregelt)

der CSS-Code dazu:

Code Auswählen Erweitern

/* [bildrechts|...] */
span.rightcontentimage {

    float:right;
border: solid;
max-width: 80px;
max-height:100px;
margin: 0px;
padding: 0px;

}


Das Bild bleibt in der Originalgröße, nur der Rahmen verändert sich in die gewünschte Pixelzahl - weiß jemand woran das liegt?


mfG

Andi.eBar

Super, genau das habe ich gesucht! 

Vielen Dank! 

PS: den Beitrag habe ich eher versehentlich im FAQ gepostet,  bitte an die richtige Stelle schieben

Hallo mozilo Communty,


nachdem ich mich jetzt einige Zeit mit Fotografie beschäftigt habe, hab ich beschlossen meine eingerosteten
Homepagekentnisse wieder hervorzuholen um für Kleinunternehmer individuelle Webseiten zu erstellen um mir ein paar
Euro neben dem Studium zu verdienen. Auf der Suche nach einer einfachen Möglichkeit dem Kunden das Zepter in Sachen Webpflege in die Hand zu geben - und das noch relativ leicht verständlich und ohne Gefahr bin ich auf mozilo gestoßen.


Nun scheitere ich im Moment allerdings daran, dass ich es nicht auf die Reihe kriege das Navi (was ich mir zugegebener maßen etwas abgekupfert habe ) identisch ins cms zu übersetzen, so dass die Hover Funktion mit den verschiedenen Farben weiterhin funktioniert. Zu sehen hier http://www.zwicknagel-fahrraeder.de/


Die css dazu:

Code Auswählen Erweitern

nav mainmenu {
    width: 800px;

}



nav ul.mainmenu{
    padding: 2px;
margin-top: 0px;
    margin-left: 25px;
 
}




nav ul.mainmenu li.mainmenu {
    list-style: none;
    float:left;
margin: 0px;
padding 0px;
    border-right: 1px solid #dfdfdf;
}



nav ul.mainmenu li.mainmenu a {


    text-decoration: none;
font-size: 18px;
font-weight: bold;
    display: block;
    color: #151616;
    padding: 16px 28px 14px 28px;

    transition: background 0.3s ease-out; /* explorer 10 */
    -webkit-transition: background 0.3s ease-out; /* chrome & safari */
    -moz-transition: background 0.3 ease-out; /* firefox */
    -o-transition: background 0.3 ease-out; /* opera */
}



nav li ul {

background-color: #transparent;
margin: 0px;
padding: 0px;
width: 155px;

}

nav ul li.cat1:hover a, nav ul li.cat1:hover > ul li a 
{
background-color: #ff6100;
text-decoration: underline;
}
nav ul li.cat2:hover a, nav ul li.cat2:hover > ul li a
{
    background-color: #5782aa;
text-decoration: underline;
}

nav ul li.cat3:hover a, nav ul li.cat3:hover > ul li a
{
    background-color: #95d310;
text-decoration: underline;
}

nav ul li.cat4:hover a, nav ul li.cat4:hover > ul li a
{
    background-color: #004C66;
text-decoration: underline;

}
nav ul li.cat5:hover a, nav ul li.cat5:hover > ul li a
{
    background-color: #332B40;
text-decoration: underline;

}



nav ul li:hover > a
{
    color: #transparent;
background-color: #696969;
}



nav ul li:hover > ul
{
    visibility: visible;

}



Was mir quasi fehlt ist die Möglichkeit li kategorien zu vergeben - kann mir da geholfen werden?



Vielen Dank im Voraus,

andi.ebar