Jump to content
kenryan

Help modifying w3 template

Recommended Posts

I am building a website using a w3 responsive web design template. The template has top navigation, left side navigation, and the main content area is divided into two columns (on the template the right column is shown as being used for advertising.

I would like to eliminate the right column in the main content area. Can anyone tell me what I need to change. Here is a link to the template on w3 ...

https://www.w3schools.com/w3css/tryit.asp?filename=tryw3css_templates_webpage&stacked=h

 

Thanks,

Ken

Share this post


Link to post
Share on other sites

Completely remove 'w3-third' class column elements, then remove 'w3-twothird' class from remaining column so that 'w3-container' class only, remains.

Share this post


Link to post
Share on other sites

I have another question about modifying this w3schools template. I have successfully deleted the right hand column, per the instructions above. I have a paragraph of text, followed by an image. My question is, how do I display the image in such a way that the size of the image is optimized for different screen sizes? Thanks, Ken.

Share this post


Link to post
Share on other sites

Make it responsive by using a percentage value. You can then set a max-width for larger devices, you can also set fixed widths depending on device width using media queries.

Share this post


Link to post
Share on other sites

Thanks. I added this to my css:

.image-responsive {width:100%; height:auto;}

This seems to make the image size itself correctly for all screen sizes.

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×