W3CSS sidebar, and footer issues

[gordonisnz]

Hello. This is a brand new  website & i'm upgrading my website to use W3CSS in other pages & creating this brand new site.

http://tv.kwister.com/index1.php

I am having difficulty in setting up a page with a side menu, & middle / footer. Do not worry about colours, i'm only using the weird colours too see what I am doing.

1) My sidebar is  a quarter of the screen (I may reduce it later on..).  The main body of the page uses  style="margin-left:25%" -

Is it possible to allow the sidebar to be a variable with - to increase or decrease depending on the text included in the sidebar (with a bit of padding), and also the main part of the screen to auto increase too ?

 

I used the w3-quarter and w3-rest css parts but when i put text in the main body, it gets "hidden" by the sidebar.

 

Ive changed it to w3-row and w3-col using the GRID system, but the text in the main screen is still hidden.

 

Can this be fixed ?

2) Also, with the footer.  I cant seem to move it under both the side and main parts of the screen (teal color).  

The footer part only goes across the bottom of the main part of the screen. Is there a way to fix this without using "style" at all ? & just CSS3 ?

 

(edit - Changed to http://tv.kwister.com/index1.php  - Using sidebar.   index.php does not use sidebar)

 

 

 

Edited June 24, 2018 by gordonisnz