Search code examples
htmlcssalignment

How to align a child DIV to center (not middle)?

i spend a day searching for a way to align my child DIV from its parent but all my research show same results.

This is my first time creating a webpage.

!https://i.sstatic.net/XPnAM.png <== result

https://jsfiddle.net/backspaced/6uy56hw4/ <== Code

._header0 {
position: relative ;
white-space: nowrap ;
overflow: hidden ;
text-align: center ;
width: 100% ;
Solution

  • If your are trying to center any div within another div container you can give the inner-div the following CSS:

    display:inline-block;

    Then give the outer-div the following CSS:

    text-align:center;

    JSFiddle example minus the superfluous markup and styling for ease of understanding.

    JSFiddle