DIV soll sich dynamisch seinem Inhalt anpassen (Breite)

[Christian S.]

Hallo,

standardmäßig nimmt ein DIV element ja immer die volle Breite ein.

Ich möchte aber, dass es sich dynamisch seinem Inhalt anpasst (von der Breite her).

<div>

<input type="text />

</div>

Habe schon vieles probiert. display: inline geht nicht richtig. das einzige was geht ist display:table oder display:table-cell. Aber das kennt der IE nicht.

Gibts was besseres?

Gruß
Christian

[anno2007]

Hallo ,

Ich möchte aber, dass es sich dynamisch seinem Inhalt anpasst (von der Breite her).

dann nim doch <span>. Das spasst sich automatisch an.

Gruß
anno2007

[Christian S.]

Hallo ,

Ich möchte aber, dass es sich dynamisch seinem Inhalt anpasst (von der Breite her).

dann nim doch <span>. Das spasst sich automatisch an.

Gruß
anno2007

Nein. Das wäre dasselbe wie <div style="display:inline"> und das hat komische Effekte auf das innere des Divs...

außerdem darf in <span> nicht jedes Element stehen, sondern nur Blockelemente.!

Gruß!

[Timon]

Hi,

könnte es mit 'width: auto' gehen?

Timon @ http://www.wahnsinn.de.tl

[Christian S.]

Hi,

könnte es mit 'width: auto' gehen?

Timon @ http://www.wahnsinn.de.tl

nein leider nicht :-(

das macht ja genau dasselbe, wie wenn ich es weglasse...

[Detlef G.]

Hallo Christian

Ich möchte aber, dass es sich dynamisch seinem Inhalt anpasst (von der Breite her).

<div>

<input type="text />

</div>

Habe schon vieles probiert. display: inline geht nicht richtig. das einzige was geht ist display:table oder display:table-cell. Aber das kennt der IE nicht.

Anhand deines Quelltextschnipsels weiß ich weder, wodurch sich die unterschiedliche Breite des Inhalts ergibt, noch wie es im Endeffekt aussehen soll, noch wie der Rest der Seite aufgebaut ist.
Deshalb zähle ich nur ein paar Möglichkeiten auf, die eventuell helfen könnten.

• Breitenangabe in em, oder
• float, oder
• display:table für FF und display:inline für IE (eventuell display:inline-block für andere Browser), oder
• display:table für FF und position:absolute für IE (eventuell display:inline-block für andere Browser)

Auf Wiederlesen
Detlef

[Christian S.]

Hi,

Anhand deines Quelltextschnipsels weiß ich weder, wodurch sich die unterschiedliche Breite des Inhalts ergibt, noch wie es im Endeffekt aussehen soll, noch wie der Rest der Seite aufgebaut ist.

Die unterschiedliche Breite ergibt sich einfach dadurch, dass unterschiedlicher Inhalt da stehen kann... Klar oder?

Aussehen soll es so, dass das umliegende <div> sich um seinen Inhalt schmiegt. Also quasi so, als wäre das <div>...</div> ein <table><tr><td>...</td></tr></table>.

Der table nimmt dann ja auch nicht die volle Breite ein.

Daher funktioniert ja auch display:table oder display:table-cell.
(im FF).

Für den IE hab ich leider noch keine Lösung. Deine Vorschläge waren zwar gut, aber funktionieren nicht für den IE.

Gruß
Christian

• Breitenangabe in em, oder
• float, oder
• display:table für FF und display:inline für IE (eventuell display:inline-block für andere Browser), oder
• display:table für FF und position:absolute für IE (eventuell display:inline-block für andere Browser)

Auf Wiederlesen
Detlef

[Detlef G.]

Hallo Christian

Die unterschiedliche Breite ergibt sich einfach dadurch, dass unterschiedlicher Inhalt da stehen kann... Klar oder?

Nein, woher kommen die unterschiedlichen Inhalte?
Warum weißt du nicht, wie groß die Inhalte sein werden?

Aussehen soll es so, dass das umliegende <div> sich um seinen Inhalt schmiegt. Also quasi so, als wäre das <div>...</div> ein <table><tr><td>...</td></tr></table>.

Ein Div allein bleibt normalerweise unsichtbar. Also welche Formatierungen hat es, damit es zu sehen ist, ob es sich um den Inhalt schmiegt?

Der table nimmt dann ja auch nicht die volle Breite ein.

Das ist nun einmal die Defaulteigenschaft einer table, nicht aber die eines Div.

Für den IE hab ich leider noch keine Lösung. Deine Vorschläge waren zwar gut, aber funktionieren nicht für den IE.

Die Aussage "funktioniert nicht" funktioniert nicht!
Was genau funktioniert nicht?
Wie genau hast du es versucht?
Bei deinem Quelltextschnipselchen in einem ansonsten leeren Dokument wird bei mir das Div auch im IE (6) mit jedem meiner Tipps genau so breit dargestellt, wie sein Inhalt ist.
Also was ist da noch drum herum?
Was ist da noch genau drin?
Welche anderen Angaben in deinem CSS verhindern, dass es bei dir so dargestellt wird, wie du es willst?

Ich weiß immer noch nicht, wie es genau aussehen soll und auch nicht, was du genau versucht hast.

Wenn du nicht nur ein paar Tipps ins blaue haben willst, sondern konkrete Hilfe, dann poste einen Link auf die Seite, so wie sie im FF funktioniert. Wenn dir das nicht möglich ist, dann poste hier den relevanten Quelltext (der Teil in deinem ersten Posting war etwas sehr gekürzt) und dazu das CSS für das Problem-Div, sein Elternelement und seinen Inhalt komplett.

Auf Wiederlesen
Detlef