How I keep html elements on the same line

Asked

Viewed 29,597 times

1

Well theoretically my question is the following, I created two Ivs in html, however when doing the second, the second div is not on the same "line" as the other but rather on the bottom. I wonder if there is any html tag that keeps the elements all in the same line, no need there is css margin-top.

Thank you.

html
  • 1

    Show your pf code.

  • display: inline-block?

  • I don’t know if I understand it well, but it seems that you need to float:left in div, but you have to make sure that the width of the two, added together, is not greater than the total width available. <div id="larger" style="width:600px;"> <div id="less_left" style="width:290px; margin-right:10px; background-color:#f00; float:left;"></div> <div id="less_right" style="width:290px; float:left; -background color:#00f"></div> </div;>

  • Use <span> instead of <div>?

2 answers

3


The question is not very specific. So it is not possible to give a concrete answer, but I will try to answer generally.
The div tag when created by default has the attribute in css "display:block".
Put yourself in css.:

div{
   display:inline;
}

All div tags will have this feature, so they were on the same line.
You can also "configure".:

div{
   float:left;
}

So as long as the Ivs can be on the same line they are followed, if there is no space they go to the line below.

Depending on the goal can also use table.

1

There is the property display elements, and some tags already have a default value for this property. The simplest case is that the <div> has display:block and the <span> possesses display:inline .

I do not recommend changing this property if we already have tags with different names to identify the function of each.

To have a slightly better reference, give a read http://www.w3schools.com/html/html_blocks.asp

Browser other questions tagged html

You are not signed in. Login or sign up in order to post.