Quantcast
Channel: Active questions tagged flexbox - Stack Overflow
Viewing all articles
Browse latest Browse all 1675

How can I move a flex-item to the right while two other flex items remain on the left? [duplicate]

$
0
0

enter image description hereI need to push the "cancel button" (x) to the right of the modal. If I use justify-content: space-between, the text "Are you sure you want to do that?" gets moved to the center (which needs to remain on the left).

As this is purely a flex-box programming challenge, how do I accomplish this without using other css styling methods such as margin-left: auto if at all possible?

Here is the current relevant code:

.first-row{  display: flex;}
<div class="modal"><div class = "first-row"><div class="icon">!</div><div class="header">Are you sure you want to do that?</div><button class="close-button">✖</button></div> <!-- Fist Row Div--><div class="text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Pariatur excepturi id soluta, numquam minima rerum doloremque eveniet aspernatur beatae commodi. Cupiditate recusandae ad repellendus quidem consectetur sequi amet aspernatur cumque!</div><button class="continue">Continue</button><button class="cancel">Cancel</button></div>

Viewing all articles
Browse latest Browse all 1675

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>