Need help to make Weather App responsive. TIA

Need help to make Weather App responsive. TIA
0

#1

Below is the link for Pen :


#2

http://www.w3schools.com/html/html_responsive.asp

http://www.w3schools.com/css/css_rwd_intro.asp


#3

What is it in particular that you need help with? Your app is fairly small and arguably responsive as-is.


#4

There is space after the footer in desktop and tablet mode when I view the pen in Full Page mode. In case of mobile view, there is no space after the Footer.


#5

Thanks for sharing the links. I will read through the documentation as well.


#6

you’re welcome my friend


#7

you do know the minute you pull this code outside of codepen it’s going to glitch out.
Better to get the bulk done in codepen then move to your desktop editor and browser.


#8

Can I assume you want the footer to stick to the bottom? If so, just add the Bootstrap class “navbar-fixed-bottom” to your footer.


#9

If I apply “navbar-fixed-bottom” class then the text becomes unscrollable for small screens


#10

I would change the font size of the your title so it shrinks to fit on a smaller screen. I’d also slim down that footer so it doesn’t take up so much screen space. To make a scrollable page (not my suggestion here), you can add margin-bottom to the main content of 150px (or whatever the height of your footer is).


#11

Thanks for the help. I will try to implement your suggestions.