Div element um x prozent breiter als text

[someRookie]

Hallo Leute,

ich hab da mal eine frage.
Ich nutze Div-elemente um mein Menü anzuordnen.
Bisher hatte ich breite dieser Div´s mit css per width:auto formatiert.
Wenn ich den aktiven link aber nun mit <strong> versehe, dann wird das div breiter und das sieht man, weil ich die einzelnen Div mit einem Trennzeichen verbinde, dass auch in einem Div liegt.. dass sieht ungut aus.
Gibt es eine Möglichkeit ein Div element um x prozent breiter generieren zu lassen, als die schrift breit ist, damit ich diesen effekt unter kontrolle bekomme ?

über tipps oder hilfe würde ich mich freuen

hier mal ein Auszug, warum ich durch mein trennzeichen probleme habe
<a href="index.html"><strong>Startseite</strong></a></div><div class="menuItemSeparator"></div>
dieser Code wiederholt sich  für jeden Menüpunk, ausser dem letzten

[henman]

hallo,

Gibt es eine Möglichkeit ein Div element um x prozent breiter generieren zu lassen, als die schrift breit ist, damit ich diesen effekt unter kontrolle bekomme ?

das kannst du mit CSS machen, Stichwort padding

<a href="index.html"><strong>Startseite</strong></a></div><div class="menuItemSeparator"></div>
dieser Code wiederholt sich  für jeden Menüpunk, ausser dem letzten

mir scheint, du hast die Fähigkeiten von CSS noch nicht richtig verstanden. warum gibst du dem a-Element nicht eine Klasse und machst so die Eigenschaften? Damit sparst du dir sinnlos viele divs.

z.B.:

CSS

a.navi {display:inline-block;  
padding:5px;  
font-weight:bold;  
[...]  
}

HTML

<a class="navi" href="#">Link </a>

Deinen "menuItemSeperator" kannst du über <http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#before_after@title=:after oder :before> einfügen.

grüße,
henman

[Marc]

Hallo someRookie,

<a href="index.html"><strong>Startseite</strong></a></div><div class="menuItemSeparator"></div>
dieser Code wiederholt sich  für jeden Menüpunk, ausser dem letzten

mir scheint, du hast die Fähigkeiten von CSS noch nicht richtig verstanden. warum gibst du dem a-Element nicht eine Klasse und machst so die Eigenschaften? Damit sparst du dir sinnlos viele divs.

Außerdem ist jedes Menü eine Liste von Links, gehört also in ein ul - udn dafür findest Du dann auch tausende fertiger Beispiele, die du relativ leicht an deine Bedürfnisse anpassen kannst - z. B. List-a-matic

Viele Grüße,
Marc.

[someRookie]

Hi Marc,

okay, ich glaube den wert dieser information zu erkennen, wenn ich daran denke, dass mein html auch ordentlich sein soll.

Menülisten stellt man als in in ul dar...
auch in horizontalen Menü? Dabei handelt es sich nämlich in meinem Fall...
in diesem einem.

gruss
someRookie

[someRookie]

Nachtrag:

ich hätte erst in den link schauen sollen, bevor ich antworte..
da ist das ganz ja auch für horizontale menüs

[someRookie]

a.navi {display:inline-block;

padding:5px;
font-weight:bold;
[...]
}

  
ok, ich setze natürlich klassen ein, wollte ich aber nicht mit code ablenken, der derzeit nich einwirkt.  
  
was das padding angeht... das is für mich nich nachvollziehbar.  
ein div element mit bold-text ist auch breiter als ein div element ohne bold-text, wenn es kein breiten attribut hat oder irre ich da ?  

[ChrisB]

Hi,

ein div element mit bold-text ist auch breiter als ein div element ohne bold-text, wenn es kein breiten attribut hat oder irre ich da ?

Höchstens dann, wenn es nicht als block dargestellt wird.

MfG ChrisB

[someRookie]

Deinen "menuItemSeperator" kannst du über <http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#before_after@title=:after oder :before> einfügen.

grüße,
henman

Ich wollte mich dem grad widmen, aber seh ich richtig, dass dies nicht vom IE umgesetzt wird ?

[ChrisB]

Hi,

Deinen "menuItemSeperator" kannst du über <http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#before_after@title=:after oder :before> einfügen.

Ich wollte mich dem grad widmen, aber seh ich richtig, dass dies nicht vom IE umgesetzt wird ?

Doch.
Nur von veralteten Versionen nicht.

MfG ChrisB