Hi, I have taught myself CSS/PHP/HTML over the last week be reverse engineering a website that my friend constructed for me. I have now given the site a complete facelift: http://update.hallidayshydropower.com/index.php I am Really stuck on one small problem.... The main content container seems to 'jump' down when the web browsing window adjusted to a smaller size. It also jumps down on computers with a low resolution screen. The picture above the main container is set to the same width and does not jump down, and neither does the banner & menu across the top. does any one know why this is? Is there a way to 'fix' the container in a certain position? This may be very easy for someone to solve.... i have never had anyone to teach me so i don't know! **if you can't understand what i am trying to explain, just make the width of your browsing window smaller by going to the left or right limit of the window until you get the double ended arrow then hold and drag across to resize the window smaller**
Put #main_container, #content_container and #footer_container within a new <div> with fixed width. Regards.
First of all: Put the Google javascript code into the <head>, not where you have it now. And yeah, a site wrapper would fix it. CSS code like this #wrapper {width: 867px;height:100%;margin:0 auto;} Code (markup): HTML code like this: <body> <div id="wrapper"> ... REST OF YOUR CODE HERE ... </div> </body> Code (markup): Like this it should do the trick. Maybe you need to adjust the width of the wrapper.
Thanks for the responses.... i now have a new problem! i have included all inside the main container, and i have also created a right_container to house the title pic and the content containers. this seems to work fine for firefox and chrome, but in internet explorer it is positioned bellow the sub menu container. can anyone spot why this is? Thanks!
*** NB I am only working on the HOME PAGE at the moment!!**** i will be changing the rest when i can!