Aut. Zeilenumbruch in div & p Elementen

[Peeed]

Ich habe diverse div und p Tags, die eine bestimmte Breitenangabe durch css-Klassen bekommen. Wenn der Text innerhalb dieser Elemente nun aber länger als die vordefinierte Breite ist, soll der Text in eine neue Zeile umbrechen. Wie mache ich das?

.klasse{
        line-height: 1.0em;
        font-size: 1.2em;
        background-color: #FFFFFF;
        text-align: left;
        width: 230px;
        float:left;
}

Danke für Antworten.

[wahsaga]

hi,

Ich habe diverse div und p Tags, die eine bestimmte Breitenangabe durch css-Klassen bekommen. Wenn der Text innerhalb dieser Elemente nun aber länger als die vordefinierte Breite ist, soll der Text in eine neue Zeile umbrechen. Wie mache ich das?

was willst du da noch groß "machen"?
das ist doch das default verhalten für "normalen" text in solchen elementen.

gruß,
wahsaga

[Peeed]

hi,

was willst du da noch groß "machen"?
das ist doch das default verhalten für "normalen" text in solchen elementen.
gruß,
wahsaga

Schon, aber er tut es nicht. Das Element wird dann verlängert, auch aus dem sichtbaren Bereich hinaus.

[wahsaga]

hi,

das ist doch das default verhalten für "normalen" text in solchen elementen.

Schon, aber er tut es nicht. Das Element wird dann verlängert, auch aus dem sichtbaren Bereich hinaus.

dann liegt das vermutlich an deinem code (soferns kein browserfehler ist).

gibt es noch andere faktoren? (overflow, whtie-space, vor umbruch schützende entities)

online-beispiel?

gruß,
wahsaga

[Peeed]

hi,

das ist doch das default verhalten für "normalen" text in solchen elementen.

Schon, aber er tut es nicht. Das Element wird dann verlängert, auch aus dem sichtbaren Bereich hinaus.

dann liegt das vermutlich an deinem code (soferns kein browserfehler ist).

gibt es noch andere faktoren? (overflow, whtie-space, vor umbruch schützende entities)

Eigentlich nicht. Es gibt noch zwei umgebene div-Bereiche, aber die haben lediglich Farb- und Größenangaben; außerdem haben diese noch float:left und clear:both Angaben. Online Beispiel geht leider nicht, da sich die Seiten in einem geschützten Kundenbereich befinden.

Gruß Peeed

[wahsaga]

hi,

Online Beispiel geht leider nicht, da sich die Seiten in einem geschützten Kundenbereich befinden.

na dann lassen wir's halt, wenn du nicht mal willens oder in der lage bist, mal schnell irgendwo ein, ggf. anonymisiertes, beispiel hochzuladen.

gruß,
wahsaga

[FrankaD]

hi Peeed,

Eigentlich nicht. Es gibt noch zwei umgebene div-Bereiche, aber die haben lediglich Farb- und Größenangaben; außerdem haben diese noch float:left und clear:both Angaben.

na das ist doch schon was, wenn du diese angaben einfach mal zugänglich machst, wäre es einfacher zu sagen, woran's liegen kann. muss ja nicht gleich online sein, wenn du hier _etwas_ code postest, geht's u.u. auch.

F.

[Peeed]

hi Peeed,

Eigentlich nicht. Es gibt noch zwei umgebene div-Bereiche, aber die haben lediglich Farb- und Größenangaben; außerdem haben diese noch float:left und clear:both Angaben.
na das ist doch schon was, wenn du diese angaben einfach mal zugänglich machst, wäre es einfacher zu sagen, woran's liegen kann. muss ja nicht gleich online sein, wenn du hier _etwas_ code postest, geht's u.u. auch.

F.

Die Klasse des umgebenen DIV sieht so aus:

.contentBlock {
overflow : hidden;
background : #ffffff;
color : #000000;
float : left;
width : 80%;
padding-bottom : 10px;
margin-bottom : 0;
border : medium none inherit;
}

Dann folgt ein div mit dieser Klasse:

.innenabstand {
padding : 0.3em 0.7em 0 1em;
}

Und dann das Div, worum es mit geht:

<div class="klasse">
<label for="Kontaktinfo">Wie sind Sie auf uns aufmerksam geworden?</label>
</div>

<div>
<input id="Kontaktinfo" name="aufmerksam" value="" style="width:400px;" onfocus="this.select();">
</div>

die Klasse dazu:

.klasse{
        line-height: 1.0em;
        font-size: 1.2em;
        background-color: #FFFFFF;
        text-align: left;
        width: 230px;
        float:left;
}

[Ingo Turski]

Hi,

ich sehe in dem Code zwar keinen Grund dafür, daß der Text nicht umbricht, aber:

.contentBlock {
overflow : hidden;

Sollen Inhalte tatsächlich nicht angezeigt werden, wenn sie nicht passen?

.klasse{
        line-height: 1.0em;
        font-size: 1.2em;

Wie soll das denn passen?

freundliche Grüße
Ingo

[MudGuard]

Hi,

line-height: 1.0em;
        font-size: 1.2em;
Wie soll das denn passen?

Wieso sollte das nicht passen? Ist halt wenig Platz für Unterlängen und kein Abstand zwischen den Zeilen.

cu,
Andreas

[Ingo Turski]

Hi,

Wieso sollte das nicht passen? Ist halt wenig Platz für Unterlängen und kein Abstand zwischen den Zeilen.

gerade mal ausprobiert: da ist ja tatsächlich noch 1px "Luft" zwischen den Unterlängen und der nächsten Zeile und hier läßt sich sogar noch ein border-bottom reinquetschen. ;-)

freundliche Grüße
Ingo