im <li> einen Zeilenumbruch???
Eingetragen von empoint (127)
am 12.09.2008 - 08:01 Uhr in
am 12.09.2008 - 08:01 Uhr in
Hallo zusammen, also irgendwie passieren ganz dubiose Dinge...
habe ein normales Submenue ... wird natürlich als <ul><li>
ausgegeben...
jetzt das Problem:
wenn ein Link aus 2 Wörtern besteht oder mit einem Bindestrich getrennt wird, dann macht er einfach einen Zeilenumbruch...
mal ein Beispiel:
<li>Beispiel</li>
--> klappt super
<li>Bei spiel</li>
--> sieht so aus:
Bei
spiel
Ich poste mal den css code, vlt kann mir ja jemand helfen ist sehrwahrscheinlich nur ein kleines Problem:
#submenue {
margin-top: -3px;
margin-left: 100px;
width: 220px;
overflow: hidden;
line-height: 30px;
}
#submenue li{
list-style: none;
width: 171px;
display: block;
}
#submenue a{
font-family: Arial, Verdana, Tahoma;
font-size: 14px;
color: #171717;
text-decoration: none;
letter-spacing: -1px;
background-image: url(gfx/sub_list.jpg);
padding-left: 10px;
background-repeat: no-repeat;
width: 171px;
padding-right: 200px;
padding-top: 5px;
padding-bottom: 5px;
}
- Anmelden oder Registrieren um Kommentare zu schreiben
empoint schrieb #submenue
am 12.09.2008 - 08:23 Uhr
#submenue {
margin-top: -3px;
margin-left: 100px;
width: 220px;
overflow: hidden;
line-height: 30px;
}
#submenue li{
list-style: none;
width: 171px;
display: block;
}
#submenue a{
font-family: Arial, Verdana, Tahoma;
font-size: 14px;
color: #171717;
text-decoration: none;
letter-spacing: -1px;
background-image: url(gfx/sub_list.jpg);
padding-left: 10px;
background-repeat: no-repeat;
width: 171px;
padding-right: 200px;
padding-top: 5px;
padding-bottom: 5px;
}
wenn dein Wort länger als 171px ist, wird es umgebrochen weil ein #submenue a nur 171px breit sein darf. width entfernen oder größer machen. fertig. freuen :-)
ist das eigentlich ein sidebar-menü? das menü an sich hat ja auch ne width und die ist mit 220px doch recht klein. deswegen solltest du vielleicht die a width beibehalten, vielleicht etwas vergrößern oder bissl mit dem padding ausprobieren (speziell padding-right). das firefox add-on firebug wird dir dabei ne große hilfe sein.
Ne damit hat es nichts zu
am 12.09.2008 - 08:32 Uhr
Ne damit hat es nichts zu tun, die Breite ist schon völlig ok so denk ich zumindest!
denkst du? hast du's
am 12.09.2008 - 08:42 Uhr
denkst du? hast du's ausprobiert?
habs ausprobiert :)
am 12.09.2008 - 10:05 Uhr
habs ausprobiert :)
Was hat sich verändert?
am 12.09.2008 - 10:18 Uhr
habs ausprobiert :)
Ja und? Was hast du gemerkt? Hat sich etwas geändert? Bist du überzeugt worden, oder denkst du immer noch?
ich hätte schon gesagt wenn
am 12.09.2008 - 10:33 Uhr
ich hätte schon gesagt wenn das Problem behoben wär, aber es ist immer noch vorhanden, es hat sich nichts verändert!
Was genau hast du probiert?
am 12.09.2008 - 10:35 Uhr
Was genau hast du probiert? Bist du mal mit Firebug ran? Damit sieht man doch gut, was bis wohin geht... Ich kann mir kaum vorstellen, dass es an irgendetwas anderem liegt als Zusammenspiel von padding und width. Hast du mal probiert als Menüpunkt mit zwei kurzen Wörtern zu nehmen? Also z.B. "te st". Bricht das auch schon um? Wenn es das tut, dann ist es was anderes als ich vermutet hatte.
Du Ungläubiger ;-)
am 12.09.2008 - 10:41 Uhr
Bei einer gesamten Grösse von 220px des Submenu, kann der Link darin nicht 171px plus 200px padding gross sein. Beherzige also das, was aschiwi geschrieben hat.
#submenue feste Breite geben
#submenue li auf 100% setzen
#submenue a width auf 90% mit padding-left auf 10% = 100%
Mein Beispiel:
#submenue {
width: 220px;
overflow: hidden;
}
#submenue ul { margin: 0; padding: 0; }
#submenue li { margin: 0; padding: 0; width: 100%; }
#submenue a {
display:block;
width: 90%;
padding-right: 0;
padding-left: 10%;
}