css - how to position two divs next to each other, one of them is centered in the container of both divs -


How to position two divs next to each other, one of them is centered in the containers of both divs

How can I create the position of the second part of the first division and extend it to the right side?

Here's an example:

HTML:

  & lt; Div id = "container" & gt; & Lt; Div id = "div1" & gt; & Lt; / Div & gt; & Lt; Div id = "div2" & gt; & Lt; / Div & gt; & Lt; / Div & gt;   

CSS:

  # container {width: 100%; Display: inline; Height: 60px; Color: # 000; } # Div1 {margin-left: auto; Margin-Correct: Auto; Width: 200px; Height: 50px; Background color: # 333; } # Div2 {float: true; Width: 100%; Height: 50px; Background color: #ccc; }   

Thanks.

Check this:

  # container {width: 600px; Height: 60px; Limit: 1px solid #bbb; Text-align: center; }   

You need a fixed width for your container element, and you want to focus its contents.

  # div1 {width: 60%; Display: inline-block; Height: 50px; Background color: # 333; }   

Div1 can be a% width or fixed, but it should be inline-block.

  # div2 {display: inline-block; Width: 10%; Height: 50px; Background color: #ccc; Margin-right: 0; Status: Completed; }   

Use inline-block and full position for div2 and hence it will be closed after your centered div1.

Comments

Popular posts from this blog

excel vba - How to delete Solver(SOLVER.XLAM) code -

github - Teamcity & Git - PR merge builds - anyway to get HEAD commit hash? -

ios - Replace text in UITextView run slowly -