On my next challenge currently.
The site in question:
I made a inner-content-wrap with margin: 0 auto to centralise it’s contents.
In there I have 2 divs
Both these are floated to the left currently.
The problem is that I want the content-forum-wrap to be liquid which is working fine now but at the same time have the rhs div sit at it’s right and when the browser window resizes it treats the content-forum-wrap/rhs-forum-col as one entity and keeps it central but only resize the content-forum-wrap div.
I just can’t seem to get this to work, assuming this is possible?
You can actually see the rhs-col block at the bottom right corner as it’s pushed into that spot now.
But bear in mind that setting a minimum width of more than 780px on the page as a whole can seriously inconvenience and irritate the significant minority of visitors who are not using full screen windows on 1024+. You should always design your site so that it works on 800×600 screens at browser default settings without invoking horizontal scrolling.
Unfloat the left (main) div and give it a right hand margin that’s the same (or greater) than the width of the right div. You will also need to put the right div before the left div in the html.
Ok thanks getting there, still some tweaking to do on positioning but I should be able to figure that one out with margins.
My next question would be how can I set a minimum width? By this I mean that when the browser window gets sized down the forum bit won’t go less widen then lets say 1000px.
This I also want to use to avoid the rhs column to go underneath the forum when sized down.