About this Web Template:
It is possible, throught the use of the overflow property to create fake frames that look a lot like frames would typically look. This layout shows how you might do that. However, there are several problems. The biggest one is that frames make it possible to re-use code on multiple pages, and with this layout you lose that primary benefit.
This template is not consistent across browsers. Internet Explorer adds a strange gap between the browser edge and the right content edge. Both Mozilla and IE insist on having a horizontal scroll bar, when one isn't needed. Since frames are a part of the XHTML specification, I would recommend sticking with frames, rather than using this layout template. This template was written to show how overflow can be used.
Special Notes:
As I mentioned above, I don't recommend using this layout to take the place of frames. Instead, write valid XHTML frames using the Frameset DTD: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
Works in Browsers:
Windows
- Firefox and Mozilla 1
- Internet Explorer 6
Macintosh
- Firefox and Mozilla 1
- Netscape 7
- Safari 1
Details:
- HTML is set to overflow: hidden; so there are no extra scrollbars on the browser.
- Navigation frame is 200 pixels wide, absolutely positioned in the upper left corner, 100% height.
- Main column is absolutely positioned at 0 top, 215 left, no width, so it flexes with the browser window. I considered adding 30px padding to the right so that Mozilla and IE look the same, but it's ugly, so IE just has to cope. :-)
To Use the Free Web Template:
- Copy the CSS into a document named styles.css
- Copy the HTML into a file in the same directory
- Change the text to your content
- Publish both documents
The Web Site Template Data:
More Web Site Templates:
Terms of Use:
You are free to use any of the free Web templates here for personal or commercial designs, either in print or on the Web, excluding items for resale. You may not give away, sell, or redistribute the files in any way. Do not post these files on any another Web site, electronically distribute them, or include them in any package for distribution. If you find these files useful, please include a credit line or a link back to this site [http://webdesign.about.com/]. Terms of use last modified 8/29/2004.
