Hi all,
I have been playing around with the
http://sbitips.sitesell.com/iDesign3-1.zip with template files to work with. However, i noticed that the page (Look at #PageWrapper in the CSS file) is fixed at 960px width.
However, if i want the page to be flexible, i should be setting it to perhaps maybe 90% which i believe plays nicely with the browser size opened smaller than 960px. There would be a problem with the background.gif which is set at 960px if i change the width in PageWrapper to 90% for instance. The alignment of the 2 columns on the left (remaining background of the columns until the footer is using background.gif). Any work around this?
Look at this screenshot here and take note of the 2 shades of blue on the most left and right column. Background of those columns made continuous until footer by using background.gif that is 960px.
If i change the width to 90% for PageWrapper in the css file, the alignment would be totally chaotic due to the fixed width of the PageWrapper and the background.gif.
Code:
/* ------ Section 1 - Global Body, Font and Link Settings ------ */
#PageWrapper {
width: 960px;
border: 2px solid #000000; /* dark sea blue, headlines and borders */
}
Code:
/* ------ Section 3 - Page Structure Details ------ */
#PageWrapper {
margin: 24px auto;
background-repeat: repeat-y;
background-image: url(../image-files/background.gif);
}
So i want to set maximum size of my web page to be at most 1050px. If my page is set to maximum width of 1050px, then my alignment of the page would be a chaotic as well.
Code:
#FluidDesignWrapper{
width:expression(document.body.clientWidth> 1051? "1050px":"auto");
margin-top:0px;
margin-right:auto;
margin-bottom:0px;
margin-left:auto;
}
My question is there anyway i can make my website fit based on the browser size without having any horizontal scrollbar based on this iDesign template and without having my alignment off? I am using it as a basis to revamp my website to a 3 column page as it is now 2 column.
I hope i am making sense and someone please let me know if i am not. Thanks!