2 replies

Horizontal layout webpage

I am building horizontally separated site.

It has 2 columns, left one and right one.
The left section is suppose to be 40vw and 100vh.
The right section is 60vw and 100vh.

The left section is fixed and has an svg inside of it that is covering the whole left section, the whole side.

In the right section is the content.

There is also a top header and bottom footer.

The footer is suppose to be at the bottom, adjusting to the Hight of the right section, so when ever you scroll you scroll the content section until u reach the end and then the footer appears and goes over the left section at the bottom.

I have a problem with the layout of the site.
I can set the vw40/60vw, but i cant figure out how to cover the whole left section with the svg so the svg is responsive and always covering the left section.
And, when i add the footer and some content higher than left section, i get this double side scroll, first for the right section and than for the footer, i also dont know how to set the footer so it stays at the bottom only showing when you are at the end of the right section and going over the left section bottom side.

There is surly some ez fix and ill be like: "Well im dumb..", but i cant figur it out at the moment, could you please help?

Thanks ton for anyone and everyone who helps others with their code, you really are amazing for doing so!!!