one of the child div width is not reducing after it crosses 480px in responsive mode
parent div containing two divs and its flex direction is column. i want the width of the lower div to be same as the first div how do i proceed? i tried reducing the font size of
future forcast
and buttons
but still its not reducing. how do i fix this?
https://gyazo.com/7ebdbb5cf54c8467848008540db7efb6Gyazo
Gyazo
8 Replies
without code, there's no way to tell
I can guess, but not really beyond "you probably have a fixed
width
set on there"https://codepen.io/avinash-tallapaneni/pen/ExRomwX i m having this issue when width is < 480 during responsive @jochemm
there's a fixed width set on the card
the card above it simply has "100%" as a width
I gave width so that the above card wont stretch. I wanted something like the parent div should be as same as the above child div and the lower child div content should be in overflow-x :scroll
you can set a
max-width
if you only want to keep it from stretching
but with a width set, you'd have to set a different width in a media query, or it won't ever shrinkit worked i dont know if this is the right way but its working .i set max-width:21.5rem for 990px and width 100% for 480px devices,
I didn't dive deep enough into the CSS to really tell, but if it i works it works 🙂