[TYPO3-german] Bullets mit CSS formatieren

[Marcel Veronetzki]

Dann will ich mal die Ausschnitte vorführen :)

CSS:

#inhalt li
{
        line-height:        21px;
        margin-left:        20px;
        width:                320px;
        margin-bottom:      0px;
       
       
        list-style-image:    url('bgr_bullet.gif');
       
}

html:

<div class="inhalte">
	<!--  CONTENT ELEMENT, uid:108/text [begin] -->
		<a id="c108"></a>
		<!--  Header: [begin] -->
			<div class="csc-header csc-header-n1"><h1 class="csc-firstHeader">Business Consulting</h1></div>
		<!--  Header: [end] -->
			
		<!--  Text: [begin] -->
			<p class="bodytext">Business steht für gestaltungsorientierte Bilanzierung und Steuerdeklaration. Wir verbinden qualitativ hochwertige und innovative Beratung mit einer umfassenden Mandantenorientierung. Wir fragen uns, welche Anforderungen an Sie und Ihr Unternehmen gestellt werden und nehmen uns Zeit, um optimale Lösungen für Ihre wirtschaftlichen und steuerlichen Fragen zu finden.<strong><br><br>Leistungen:</strong></p><ul><li>Stellungnahmen zu Bewertungsfragen und Bilanzpolitik</li><li>Betriebliche Steuererklärungen</li><li>Break-Even-Analyse</li><li>Kosten-Leistungsrechnung</li><li>Vorausschauende wirtschaftliche Gestaltung</li></ul>

		<!--  Text: [end] -->
			
	<!--  CONTENT ELEMENT, uid:108/text [end] -->
		</div>


Viel spass damit :)


JoH asenau schrieb:
>>> CSS lässt auch die direkte Methode mit
>>>
>>> list-style-image: url("http://png.com/ellipse.png")
>>>
>>> zu. Kommentar der CSS-Bibel
>>>       
>> ist schon klar, das weiss ich. marcels problem ist aber, dass die
>> (vertikale) position der bullets in den browsern unterschiedlich ist.
>> und sowas wie 'list-style-image-position' gibts nicht und ich wüsste
>> auch nicht, dass es eine möglichkeit gibt per CSS den bullet direkt zu
>> formatieren. daher empfehle ich in so einem fall den workaround mit
>> background-image. sieht in jedem fall sauber aus, hat aber auf den von
>> christian angesprochenen nachteil, dass hintergrundbilder in den
>> standardeinstellungen einiger browser nicht gedruckt werden.
>>     
>
> Üblicherweise gibt es bei der Positionierung von bullets keine
> Crossbrowser-Problematik. Sie werden bezogen auf das dazugehörige <li> in
> der Regel linksbündig und veritkal mittig angezeigt.
> Sollte das Ergebnis dennoch davon abweichen, dürfte das daran liegen, daß
> innerhalb der <li> Tags weitere Tags wie z.B. ein <a> enthalten sind.
> Die Kunst liegt also nicht darin, die bullets korrekt zu positionieren,
> sondern die Box des darin enthaltenen Tags.
>
> Ein kurzer Ausschnitt aus dem erzeugten HTML-Code sowie des dazugehörigen
> Abschnitts im CSS wären vielleicht ganz hilfreich.
>
> Joey
>
>   


Mit freundlichen Grüßen, 
Marcel Veronetzki

-- 
Smart Things GmbH 
Rochusstr. 41 
51570 Windeck 

Telefon +49 (0)2292 95 99 528 
Telefax +49 (0)2292 95 99 527
http://www.smartthings.de/ 
veronetzki at smartthings.de

Registergericht: AG Siegburg, HRB 8791 
Geschäftsführer: Philipp Huberty