html - Make Element Appear After Another Element Using Only CSS -
i have following html:
<h2 class="brand> </h2> .. .. (lots of other elements <img, p, h2 etc) .. <div class="reviews">...</div> how can use css make div element class "reviews" appear after h2 element class "brand". this:
<h2 class="brand> </h2> <div class="reviews">...</div> .. .. (lots of other elements <img, p, h2 etc) .. update: able set margin-top negative make appear wanted looks floating on top of things. used display:block still seems floating on top of things. want occupy space.
the negative margin not appear correctly since different screen sizes have different negative margins , displaying @ different positions.
thanks!
you can use flexbox. introduces order property allows reorder flex items:
#wrapper { display: flex; /* magic begins */ flex-direction: column; /* column layout */ } #wrapper > .brand ~ :not(.reviews) { order: 1; /* move bottom */ } <div id="wrapper"> <h2 class="brand">title</h2> <p>paragraph</p> <div>div</div> <div class="reviews">reviews</div> </div>
Comments
Post a Comment