Jack Mathers Jack Mathers - 2 years ago 98
HTML Question

get two div to be on the same margin line and stay there even if the browser's size is changed

I have two divs. One is around a h4 and the other around a p. I want the p to be in the middle so its set as margin-left: auto; and margin-right:auto; I dont want the h4 to also be in the middle I want it to be set so its inline with the left side of the div.

---------------page size-----------------

---In the center--
----of the page---


Here is a little example of what I want it to be like. If I manually set the margin-left to fit in with the position then if someone has a different screen size then it won't be there. This is for a school project so I am not very good at html or css so forgive me if its really simple or stupid.

Answer Source

Margin: auto for Right and Left will not work because it gets all width. Margin: auto works when you has set fixed width for and element. In this case, you can give "Text-align: center" to

and it make it simple.

  border: 1px solid #000;
  padding: 20px 0;
  width: 300px;
  height: 100px;
  margin: 20px auto;
  margin: 0 0;
<div class="h4-wrapper">
  <h4>On Left Side</h4>

  <p>On middle.</p>

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download