---
title: "Formatierung in zwei Varianten??!"
url: "https://www.typo3.net/d/43873-formatierung-in-zwei-varianten"
source: "typo3.net"
tags: ["Frontend","Styling","Frage","HTML & CSS"]
created: "2006-05-29"
last_reply: "2006-05-30"
replies: 5
solved: false
page: 1
pages: 1
lang: "de"
---

# Formatierung in zwei Varianten??!

Frontend › Styling · 5 Antworten · gestartet 2006-05-29

## Eröffnungsbeitrag

**donCGN** · 2006-05-29 · [Beitrag #1](https://www.typo3.net/d/43873-formatierung-in-zwei-varianten/1)

Hi,
in den folgenden 2 bildern sehen wir 2 mal die selbe css gestaltung, warum ist bei der einen der Unterstrich so kurz und bei der anderen (so wie es sein soll) 100%

Normaler content eintrag:
[Bild: donhome.open-eyes.com/…/css_2.jpg](http://donhome.open-eyes.com/temp/css_2.jpg)

Quellcode

> <!--  Header: [begin] -->
> 			<div class="csc-textpicHeader csc-textpicHeader-26">
> 		<!--  Header date: [begin] -->
> 			<p class="csc-header-date">05/05 2006</p>
> 		<!--  Header date: [end] -->
> 			<h2><a href="index.php?id=407">so soll es aussehn</a></h2></div>
> 		<!--  Header: [end] -->

und NEWS-Latest
[Bild: donhome.open-eyes.com/…/css_3.jpg](http://donhome.open-eyes.com/temp/css_3.jpg)

Aus dem NEWS Template

> <!-- ###NEWS### begin
> 			Template for a single item
> 		-->
>     <td width="100" rowspan="2" valign="top">###NEWS_IMAGE###</td>
> 	  <td width="807" height="26" valign="top"><span class="date">###NEWS_DATE###</span></td>
> 	</tr>
>
> <tr>
> 			  <td height="72" valign="top" bgcolor="###GC2###">

CSS

> /* Header date */
> P.csc-header-date {
> 	font-family: Verdana;
> 	font-size: 9px;
> 	letter-spacing: 2px;
> 	font-weight: lighter;
> 	color: #000000;
> 	border-bottom: 1px dotted #666666;
> 	font-style: normal;
> }
>
> /* News date */
> .date {
> 	font-family: Verdana;
> 	font-size: 9px;
> 	letter-spacing: 2px;
> 	font-weight: lighter;
> 	color: #000000;
> 	border-bottom: 1px dotted #666666;;
> 	font-style: normal;
> }

## Antworten

### [#2](https://www.typo3.net/d/43873-formatierung-in-zwei-varianten/2) · einpraegsam.​net · 2006-05-30

folgendes im css .date hinzufügen:

```typoscript
width: 100%;
```

denke dass die Tabellenzelle zwar 807px breit ist aber der span Eintrag nur so breit wie der Inhalt...

### [#3](https://www.typo3.net/d/43873-formatierung-in-zwei-varianten/3) · donCGN · 2006-05-30

hi, hat leider nicht geholfen.

... du wurdes gezwungen?!   :D

### [#4](https://www.typo3.net/d/43873-formatierung-in-zwei-varianten/4) · einpraegsam.​net · 2006-05-30

Poste mal deinen Quelltext rund um News Latest

### [#5](https://www.typo3.net/d/43873-formatierung-in-zwei-varianten/5) · miwolfram · 2006-05-30

> **donCGN schrieb:**
>
> hi, hat leider nicht geholfen.

hast dus auch ausprobiert?
Gib im Stylesheet einfach ein **background-color:red;** dazu, dann wirst du sehen was er damit gemeint hat.

Ein p-Tag ist ein Block-Element, erzeugt einen Zeilenumbruch und füllt - wenn keine Breite vorgegeben - die ganze verfügbare Breite auf.

Ein span-Tag ist jedoch ein Inline-Element das keinen Zeilenumbruch erzeugt und nur den Platz einnimmt den das darin enthaltene Element (in diesem Fall das Datum) braucht.

siehe: <http://www.css4you.de/elemente.html#inline>

Du kannst nun entweder statt dem span-Tag ein Block-Element nehmen (z.b. p oder div) oder das span-Tag als **display:block;** definieren und Höhe und Breite angeben.
Dann wird der strichlierte Rahmen so lang sein wie er sein soll.

### [#6](https://www.typo3.net/d/43873-formatierung-in-zwei-varianten/6) · donCGN · 2006-05-30

ich werd verrückt ...

"div" anstelle von "span" und alles ist perfekt

besten dank!!!!!! :-D

---

Quelle: „Formatierung in zwei Varianten??!“, typo3.net, https://www.typo3.net/d/43873-formatierung-in-zwei-varianten
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.