Gernot Back: UL - Square-Größe festlegen

Beitrag lesen

Hallo Fabienne,

Aber es muss doch auch ne Möglichkeit geben ohne Images....

Ja, es gibt eine andere Möglichkeit ohne Images, die sieht aber im IE ganz schlimm aus:

a) zeigt sie dort nicht die gewünschte Wirkung der Vergrößerung des Bullet-Symbols relativ zur Schriftgröße,
b) verschwindet der letzte Bullet-Punkt, aber das kann man dort (im IE) mit Conditional-Comment ja beheben, indem man line-height und font-size wieder auf jeweils 1em setzt.

In Opera 7.54 sowie Mozilla 1.7.2 funktioniert das Folgende aber:

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"  
        "http://www.w3.org/TR/html4/strict.dtd">  
<html>  
<head>  
<title>bulletsize</title>  
<meta name="author" content="Gernot Back">  
<meta name="generator" content="Ulli Meybohms HTML EDITOR">  
<style type="text/css">  
[code lang=css]  
li {  
  list-style-type:square;  
  font-size:2.5em;  
  line-height:.4em;  
  color:red;  
}  
  
li span {  
  font-size:.4em;  
  position:relative;  
  top:-.25em;  
  color:blue;  
}  
  
li span:before {  
  content:'Punkt ';  
}  

</style>
</head>
<body >
<ul>
  <li><span>eins</span></li>
  <li><span>zwei</span></li>
  <li><span>drei</span></li>
  <li><span>vier</span></li>
  <li><span>fünf</span></li>
  <li><span>sechs</span></li>
  <li><span>sieben</span></li>
  <li><span>acht</span></li>
</ul>
</body>
</html>
[/code]
Gruß Gernot