ultrus Posted October 8, 2007 Share Posted October 8, 2007 Hello, I'm creating a website for my uncle, and have nearly finished the main template for it. I thought I would stretch a bit and create a tabless css design. Everything works almost the way I want it too (have not tried it outside of Mac Firefox/Safari yet). However I've been fighting with the main content box that I want to be 100% high minus a top and bottom margin specified in pixels. An example of my current template can be seen at: http://www.fabcoco.com/akk (css on same page header) If I make the div 100% high or min-hight 100% with a top margin of 100px, the box extends beyond the page leaving a scrolling awkward gap at the bottom. While doing this, bottom-margin is ignored by the browser. I was able to sort of work around this issue by making the div 95% high. The content box base now shifts when the window size changes. I can only hope that it does not get displayed in tiny windows too often as the footer overlaps when the window gets too small. I have not played with scrolling content yet either. Any ideas on how I can modify this further to make it work the way I want? Much appreciated! Quote Link to comment Share on other sites More sharing options...
Dat Posted October 9, 2007 Share Posted October 9, 2007 You are not alone, end the end for me I had to resolve to adding 1 table in my almost complete CSS layout. When you insert 100% what it really does is make bigger than what you wanted right? I use a Mac and Safari 2.0. In my understand you want the layout to expand down as you add information (like me) like what table's do correct? Quote Link to comment Share on other sites More sharing options...
ToonMariner Posted October 9, 2007 Share Posted October 9, 2007 I work with a graphic designer who INSISTS that its right and proper to have this kind of design for a web page. As a developer and long time user of the internet I don't like sites that are limited in their function by implementing a height declaration. If you don't want a site design to be destroyed by lower resolution screens don't use anything that will be destroyed by lower resolution screens. People using Macs have (the vast majority of the time) significantly more screen space than the average pc user - you therefore are left with large gaps at the bottom of short pages and think it looks wrong - unfortunately the majority of people viewing the site will see something perfectly acceptable. The design you have created is pretty good - let it do its own thang. Quote Link to comment Share on other sites More sharing options...
ultrus Posted October 10, 2007 Author Share Posted October 10, 2007 I got it to work! It happened by trial and error mixed with relative, and absolute positioning. I did away with trying to make the content area 100% high, and just made sure the footer stayed on the bottom, and moved down if there was enough content to scroll. The result can be seen here: http://www.fabcoco.com/preview2 Thanks for your input Dat and ToonMariner. Quote Link to comment Share on other sites More sharing options...
ToonMariner Posted October 10, 2007 Share Posted October 10, 2007 that is quite a nice design... and well done like the layout too... personally - I would only have the image slide show in flash the list and 'button' on the right could have been html don't like the javascript on the links either... otherwise I like it. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.