Search code examples
htmlcssalignmentmoveweb-frontend

Issue while positioning HTML/CSS elements

I need your help guys,

I tried float I tried display:inline-block and nothing work.
They keep moving like they want not as I want if u know what I mean.

So how should I solve this problem?

enter image description here

Solution

  • You can use display: flex; property. This can give your expected result. At first wrap all your div elements with a single div. Then set that parent div's display to flex. No need to use absolute position.

    <div class="block">
    <div class="child-left">Left side contents</div>
    <div class="child-right">Right side contents</div>
</div>

.block {
     display: flex;
     justify-content: space-between;
}

    To know more about flex, check this link