Daniel Heyne: HTML div-styleProblem

Hallo! Ich habe neulich einen Balken erstellt welcher für ein Bewertungssystem gedacht sein soll! HINTER dem Balken soll eine Zahl stehen. Wenn ich mit divs arbeite steht die Zahn nicht dahinter sondern Daruner. Wenn ich es mit spans einbinde bekomme ich einen Ziemlich flachen Balken worauf man kaum noch etwas erkennt!

Hier die Codes:

<div style="background-color: #cccccc; border: 1px solid black; width:50px; margin-top: 2px; padding: 1px 1px 1px 1px;">  
<div style="background-color: #008040; color: white; font-weight:bold; max-width:50px;  width:533px; height:8px;"></div>  
</div>Hier kommt die Zahl hin!

Das dazugehörige Bild kommt hier!
Mit dem div Style

<div style="background-color: #cccccc; border: 1px solid black; width:50px; margin-top: 2px; padding: 1px 1px 1px 1px;">  
<div style="background-color: #008040; color: white; font-weight:bold; max-width:50px;  width:533px; height:8px;"></div>  
</div>Hier kommt die Zahl hin!

Das dazugehörige Bild kommt hier!
Mit span Styles

Was kann ich machen, das der Balken vollständig angezeigt wird und das die Zahl dahinter steht?

  1. Hi,

    Ich habe neulich einen Balken erstellt welcher für ein Bewertungssystem gedacht sein soll! HINTER dem Balken soll eine Zahl stehen. Wenn ich mit divs arbeite steht die Zahn nicht dahinter sondern Daruner.

    Natürlich, denn DIV ist ein Block-Element.

    Wenn ich es mit spans einbinde bekomme ich einen Ziemlich flachen Balken worauf man kaum noch etwas erkennt!

    Natürlich, denn SPAN als Inline-Element darf width und height nicht annehmen.

    Was kann ich machen, das der Balken vollständig angezeigt wird und das die Zahl dahinter steht?

    Du könntest die Grundlagen von CSS erlernen ...

    Bspw. Floating wäre in diesem Fall ein geeigneter Weg, das umzusetzen.

    MfG ChrisB

    --
    RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?