+ 2

Not getting the layouts in proper format

I got an assignment from Coursera to create a webpage like this https://github.com/jhu-ep-coursera/fullstack-course4/blob/master/assignments/assignment2/images/desktop.png And when the size of the device changes between 768px and 991px, the webpage should look like this https://github.com/jhu-ep-coursera/fullstack-course4/blob/master/assignments/assignment2/images/tablet.png And when the size falls below 768px, it should look like this https://github.com/jhu-ep-coursera/fullstack-course4/blob/master/assignments/assignment2/images/mobile.png NOW I am able to get the layout like the first image and third image but not like the second image. Can you tell me what am I doing wrong? This is the first time, I am creating a responsive model so the code might contain unnecessary lines(according to you), so it would be very helpful if you could also suggest something. This is my code https://code.sololearn.com/WVXGAEBuqBq0/?ref=app

22nd Jul 2020, 1:54 PM
AYUSH GUPTA
AYUSH GUPTA - avatar
1 Réponse
+ 6
try using the div class=“container”....it adds spacing and margin and allows it to be more responsive also use the inspect tool on chrome to check ur css to make sure its not over riding some of bootstaps margin and padding styles and if that doenst work use a screen query...if ur unfamiliar with the way they work look here: https://www.w3schools.com/css/css_rwd_mediaqueries.asp
22nd Jul 2020, 2:03 PM
toto
toto - avatar