inline DIV

[phoku]

Hallo,

ich möchte ein quadratisches div in meinem Text anzeigen. Z.B. mit

dies ist ein Quadrad <div class="q"></div> im Text

Allerdings funktioniert das nicht so richtig. Ich habe entweder einen Zeilenumbruch hinter dem div, oder die Breite wird im Firefox mißachtet. Das CSS sieht so aus:

.q {
 display: inline;
 width: 10px;
 height: 10px;
 background-color: #CCCCCC;
 border: 1px solid black;
 cursor: pointer;
 margin: 2px;
}

Weiß jemand, wie ich das korrigieren kann?

mfg
phoku

[Rouven]

Hi,

na ja, wenn ich die Spezifikation richtig verstehe, kannst du width nicht auf Inline-Elemente anwenden. Was versuchst du denn durch den Effekt zu erreichen, bzw. warum muss es ein Inline-Element sein?

MfG
Rouven

[Harlequin]

Hi,

na ja, wenn ich die Spezifikation richtig verstehe, kannst du width nicht auf Inline-Elemente anwenden. Was versuchst du denn durch den Effekt zu erreichen, bzw. warum muss es ein Inline-Element sein?

Ich denke mal, weil nur Inline-Elemente mitten im Textfluss stehen können. Ich hab hier mal den Hinweis auf display:inline-block bekommen, aber das unterstützt bisher nur der Opera...

Gruß,

Harlequin

[phoku]

hm, wenn ich es nicht auf inline setze, bricht hinter dem div der Text um. Es muss nicht unbedingt ein Inline-Element sein. Alles was ich brauche ist ein Element, auf das ich die im Stylesheet angegebene Darstellung anwenden kann.

MfG
phoku

[wahsaga]

hi,

Ich habe entweder einen Zeilenumbruch hinter dem div,

Für display:block so definiert.

oder die Breite wird im Firefox mißachtet.

Für display:inline so definiert.

Weiß jemand, wie ich das korrigieren kann?

Eigentlich suchst du display:inline-block, da der FF dies aber auch nicht versteht, könntest du das Div floaten lassen - dann kannst du ihm auch Breite und Höhe verpasssen.

gruß,
wahsaga

[MudGuard]

Hi,

Ich habe entweder einen Zeilenumbruch hinter dem div, oder die Breite wird im Firefox mißachtet. Das CSS sieht so aus:
Weiß jemand, wie ich das korrigieren kann?

Nimm ein replaced-inline Element (z.B. ein transparentes Bild) statt eines div.

cu,
Andreas