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

Make layout in flexbox with responsive [closed]

$
0
0

If you don't have Ans, then plz don't do negative response, I need this that's why I ask here. who given negative response he, her "Mor Fkr", "Chutia", "ganu", "Bho****a"

Please help me to do this (attached JPG files, what I want it) layout using flexbox with responsive, I have JS code to generate below code:

<div class="grid-container" id="gridContainer"><div class="loginBox">Login Box comes here</div><!-- Grid items will be generated by JavaScript --><div class="grid-item" style="background-image: url("thumbs/1.jpg"); border: none;"></div><div class="grid-item" style="background-image: url("thumbs/2.jpg"); border: none;"></div><div class="grid-item" style="background-image: url("thumbs/3.jpg"); border: none;"></div><div class="grid-item" style="background-image: url("thumbs/4.jpg"); border: none;"></div><div class="grid-item" style="background-image: url("thumbs/5.jpg"); border: none;"></div><div class="grid-item" style="background-image: url("thumbs/6.png"); border: none;"></div><div class="grid-item" style="background-image: url("thumbs/7.jpg"); border: none;"></div><div class="grid-item" style="background-image: url("thumbs/8.png"); border: none;"></div><div class="grid-item" style="background-image: url("thumbs/9.png"); border: none;"></div><div class="grid-item" style="background-image: url("thumbs/10.jpg"); border: none;"></div><div class="grid-item" style="background-image: url("thumbs/11.jpg"); border: none;"></div><div class="grid-item" style="background-image: url("thumbs/12.jpg"); border: none;"></div><div class="grid-item" style="background-image: url("thumbs/13.png"); border: none;"></div><div class="grid-item" style="background-image: url("thumbs/14.jpg"); border: none;"></div><div class="grid-item" style="background-image: url("thumbs/15.jpg"); border: none;"></div></div>

I tried this below code:here is also have my code (this code I generate with ChatGPT): https://codepen.io/alpesh88ww/pen/qBGqdez

below attached image like I need.

will look in desktop

will look in mobile


Viewing all articles
Browse latest Browse all 1675

Trending Articles



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