<P> ist doof

[Bruce]

Hallo

Wie kann ich mit CSS bezwecken das <P> sich verhält wie DIV, SPAN, oder TD(TABLE) sprich nicht eine 100% WIDTH-Breite von sich aus mitbringt?

Danke
Bruce

[Rouven]

Hello,

Wie kann ich mit CSS bezwecken das <P> sich verhält wie DIV, SPAN, oder TD(TABLE) sprich nicht eine 100% WIDTH-Breite von sich aus mitbringt?

indem du es mit einer entspechenden display-Eigenschaft versiehst, z.B. inline.

MfG
Rouven

[Joachim]

Hi,

DIV, SPAN

ja was nu? Div ist ein Blockelement, Span ein Inlineelement.
Möchtest Du also Inline-Eigenschaften für's P, oder Block-Eigenschaften - die P aber eh schon besitze, da ebenfalls ein Blockelement? Oder möchtest Du einfach eine width vergeben?

Gruesse, Joachim

[Cheatah]

Hi,

Wie kann ich mit CSS bezwecken das <P> sich verhält wie DIV, SPAN, oder TD(TABLE) sprich nicht eine 100% WIDTH-Breite von sich aus mitbringt?

kein mir bekannter Browser hat <p>-Elemente per Default mit width:100% versehen. Der Wert ist immer mit width:auto vorgegeben. Falls das bei Dir anders ist, setze ihn entsprechend.

Cheatah

[Bruce]

Hi,

kein mir bekannter Browser hat <p>-Elemente per Default mit width:100% versehen. Der Wert ist immer mit width:auto vorgegeben. Falls das bei Dir anders ist, setze ihn entsprechend.

Ich möchte aber kein WIDTH-Wert setzen und ich möchte auch den Absatz nicht ganz weg nehmen, sondern das Element soll so breit sein wie der Text!
wie mache ich das?

Bruce

[Bruce]

wie mache ich das?

Ah ok
run-in

[Bruce]

wie mache ich das?
Ah ok
run-in

ach ne doch nicht... hehe oh mann

[molily]

Ich möchte aber kein WIDTH-Wert setzen und ich möchte auch den Absatz nicht ganz weg nehmen, sondern das Element soll so breit sein wie der Text!

display: inline-block;
oder andere Eigenschaften, die Shrink-Fit auslösen

Mathias

[Bruce]

display: inline-block;
oder andere Eigenschaften, die Shrink-Fit auslösen

Es geht nur um <P> und ich hab alle Display:-Varianten durch..
Ich steht grad biisi aufm schlauch
Ich möchte Bündige Absätze... quasi so:
|asdasdasdasddas|
|asdasdasdasddaasdasds|
|asdasdasdasddass|

und NICHT so
|asdasdasdasddas||asdasdasdasddas|

oder so
|asdasdasdasddas|

|asdasdasdasddas|

|asdasdasdasddas|

Bruce

[Gunnar Bittersmann]

@@Bruce:

display: inline-block;
oder andere Eigenschaften, die Shrink-Fit auslösen

Wie wäre es denn mal mit nachlesen, was molily dir verlinkt hat?

Es geht nur um <P> und ich hab alle Display:-Varianten durch..

Na dann probier doch mal die 'float'-Varianten durch.

und NICHT so
|asdasdasdasddas||asdasdasdasddas|

Da gäbe es was mit 'clear' zu klären.

Live long and prosper,
Gunnar

[Bruce]

Wie wäre es denn mal mit nachlesen, was molily dir verlinkt hat?

Hab ich doch hab ich doch.. aber ich blick da nicht durch!
Habe mir sogar die Seite komplett auf meinen Rechner kopiert und auseinander genommen, aber wie gesagt ich verstehe es nicht, vorallem weil es sich da nicht primär um das P-Element dreht....

Na dann probier doch mal die 'float'-Varianten durch.

Hab ich doch auch schon, aber es muss ebestimmt eine Kombi aus beidem sein oder?

Da gäbe es was mit 'clear' zu klären.

Aha

Ich weiß, es nicht nicht SELF, aber kann mr nicht einer einfach die Lösung geben? Oder zumindest sagen woraus die CSS-Kombi in meinem (<P>-)Fall besteht!?

Bruce

[Gunnar Bittersmann]

@@Bruce:

Habe mir sogar die Seite komplett auf meinen Rechner kopiert und auseinander genommen, aber wie gesagt ich verstehe es nicht

Und was genau nicht?

vorallem weil es sich da nicht primär um das P-Element dreht....

Es ist völlig egal, ob es sich um 'p' oder 'div' oder sonstwas handelt.
Vor Go^W CSS sind alle Me^W Elemente gleich.

Na dann probier doch mal die 'float'-Varianten durch.
Hab ich doch auch schon, aber es muss ebestimmt eine Kombi aus beidem sein oder?

Aus 'float' und 'display'? Nein, bei gefloateten Elementen wird automatisch meist 'display: block' gesetzt. [CSS21 §9.7]

Da gäbe es was mit 'clear' zu klären.
Aha

Dann wird es bestimmt eine Kombi aus 'float' und 'clear' sein.

Ich weiß, es nicht nicht SELF

Eben.

aber kann mr nicht einer einfach die Lösung geben?

[ZITAT1491]?

Live long and prosper,
Gunnar

[Bruce]

?t=180996&m=1196619

[suit]

Es ist völlig egal, ob es sich um 'p' oder 'div' oder sonstwas handelt.
Vor Go^W CSS sind alle Me^W Elemente gleich.

Wenns da mal nicht einige Promi^W Formularelemente gäbe ...

[Gunnar Bittersmann]

@@suit:

Vor Go^W CSS sind alle Me^W Elemente gleich.
Wenns da mal nicht einige Promi^W Formularelemente gäbe ...

Ja, das liegt aber nicht an CSS, sondern an Implementierungen in Browsern.

'hr' macht im IE auch Zicken und widersetzt sich beharrlich dem Styling. Und bestimmt gibt’s da noch mehr …

Live long and prosper,
Gunnar

[molily]

Ich möchte Bündige Absätze... quasi so:
|asdasdasdasddas|
|asdasdasdasddaasdasds|
|asdasdasdasddass|

<div id="container">
<p>bla</p>
<p>blabla</p>
<p>blablabla</p>
</div>

#container { overflow: hidden; }
#container p { float: left; clear: left; }

Siehe Gunnars Beitrag.
So, und jetzt bist du mal endlich damit dran, Initiative zu zeigen. Genug Tipps hast du bekommen, jetzt probiere und recherchiere mal bitte selbst.

http://de.selfhtml.org/css/eigenschaften/positionierung.htm#float
http://de.selfhtml.org/css/eigenschaften/positionierung.htm#clear

Mathias

[Bruce]

Ja danke, aber soweit war ich auch schon:

---

<style type="text/css">
body{
 background-color: blue; /* Kontrast */
}

p{
 background-color: yellow; /* Nur Zur ansicht */
 float:left;
 clear:left;
}
</style>

<p>Irgendein Text...Umfliessen beendet</p>
<p>Irgendein Text...Umfliessen beendet</p>
<p>Irgendein Text...Umfliessen beendet</p>
alles danach hängt dann wieder oben??

---

Und ein <br STYLE="clear: left;"> kann ich nicht einbauen!

[molily]

Ja danke, aber soweit war ich auch schon:

Nein, warst du nicht.

<p>Irgendein Text...Umfliessen beendet</p>
<p>Irgendein Text...Umfliessen beendet</p>
<p>Irgendein Text...Umfliessen beendet</p>
alles danach hängt dann wieder oben??

Bitte lies doch meine Postings aufmerksam. Denke darüber nach, probiere selbst, versuche dem Ergebnis auf den Grund zu gehen.

Die Abstände zwischen p-Elementen kommen vom http://de.selfhtml.org/css/eigenschaften/randabstand.htm@title=margin, welches p-Elemente standardmäßig haben.

Zu overflow: Block Formatting Contexts zum Einschließen von Floats. Lies dir das alles mal in Ruhe durch.

Mathias

[ChrisB]

Hi,

Ja danke, aber soweit war ich auch schon:

Offenbar nicht.

Und ein <br STYLE="clear: left;"> kann ich nicht einbauen!

Hat Mathias auch in seinem Code auch nicht - dafuer aber etwas anderes, was die gefloateten Elemente im Fluss behaelt.

MfG ChrisB