susanloek susanloek - 2 months ago 13
CSS Question

Use available width with css

I've a special case. I want a div use the available width.

This is my code:



.parent {
width: 100%;
}
.child-left {
width: 66%;
float: left;
}
.child-right {
width: 33%;
min-width: 400px;
float: right;
}

<div class="parent">
<div class="child-left">
Lorem Ipsum
</div>
<div class="child-right">
Lorem Ipsum
</div>
</div>





The
child-right
element should be minimum 400px width. If i resize the screen the element breaks down. Is there a way, that the
child-left
element use the available horizontal space? Maybe CSS-Flexbox?

Answer

I think you can do it with flex yes.

.parent{
  display:flex;
  justify-content: space-between;
}
.child-right{
  flex-basis: 400px;
}
Comments