Size content to viewport
Google page speed insights wants me to size my content to the viewport. I have configured the viewport but do not know how to size the content to viewport. I created my website by modifying a template so I am very new to this. Google suggests "using relative values such as width:100%" but I'm not sure exactly what they are talking about or where to put this? The css for my webpage includes:
.container{width:970px;margin:0 auto}
#navigation{width:260px;padding:0 10px;clear:both}
#main-content{width:550px;padding:10px 20px 15px 20px;border:solid #999;border-width:0 0 0 1px}
I got most of this from a template so I'm not sure what I'm suppose to change to size the content to the viewport? Well, any help I can get will certainly be appreciated. The support section on this website has been great and I have been able to learn many things through it. But I am stuck on this one. Thanks much.
.container{width:970px;margin:0 auto}
#navigation{width:260px;padding:0 10px;clear:both}
#main-content{width:550px;padding:10px 20px 15px 20px;border:solid #999;border-width:0 0 0 1px}
I got most of this from a template so I'm not sure what I'm suppose to change to size the content to the viewport? Well, any help I can get will certainly be appreciated. The support section on this website has been great and I have been able to learn many things through it. But I am stuck on this one. Thanks much.
Thanks for the question. You can use the percentage values in place of the pixels. This allows for your content to expand using percentages instead of specific pixels. Hopefully, that should clarify the problem. Let us know if you have any further questions.
Regards,
Arnel C.