How to make label inside div to be in the same position as lower ones


Tags: css,html

Problem :

I have a problem. I have a code:

<div><label>Comments:</label>0</div>
<div><label>Author:</label>AuthorName</div>
<div><label>Rating</label>5/5</div>

How can I make it to be in the same width to look aesthetic? I tried to change .css label to specific width and float div to the left but it didn't work. Can somebody help me?

I would love to put it into a table with td's with the same width but I cannot change what I have in divs... Please help me.



Solution :

div label {
    display: inline-block;
    width: 150px;
}

I find this solution tends to work better than float.


    CSS Howto..

    How to put text and image in a same line?

    How to get cross browser compatibility in Print on page from all browsers?

    How did Blizzard achieve the layered cockpit view for the Starcraft II website?

    How to overflow in CSS/HTML? [closed]

    jQuery & CSS: how to convert this drawer menu from left to right?

    How to dynamically remove all unwanted CSS and JS from page

    How to toggle class using jquery if else statement?

    how to get the css floating property to work with four divs?

    How can I hide a DIV without using CSS?

    How do you name these tags in CSS? [closed]

    How to test print output of browsers with online tools?

    Make converted joomla template show 2 colums in main content

    How to get the authored style properties of an element?

    how to make row span column content start at the top of the column with css and html

    How to use a background image in Webfolio WordPress theme without breaking CSS header?

    How do I change the arrow in the select with Chosen plugin?

    How to do such layout with html+css?

    How to add table highlighting in PHP?

    using css modules in react how can I pass a className as a prop to a component

    how can i center the footer text in the bottom of the page regardless of screen size

    How to use nested p tags in CSS and Bootstrap boxes?

    How to keep css background image blurred inside a container?

    How to make footer responsive through CSS?

    How to create a simple Modal Dialog Box in JQuery?

    AngularJS - how to refactoring a CSS code style

    How to get @media to take precedence over normal styling

    How can I change the color of my body when using Bootstrap?

    How to retain CSS transform scale on checked state

    Flexbox in Chrome--How to limit size of nested elements? [duplicate]

    How do I line up CSS elements? Is there a tool I can use?