This Message Forum is no longer in use
Please use the new Bravenet Help Forums FOUND HERE
Hello,
I designed my site from a template that I found online, don't know where I got it from as I modified it to fit my needs. My problem is the site displays correctly in firefox, however, when viewing it in IE, it is messed up. It is supposed to be a 2 column layout with the left column(links) fixed and always visible with the right column(content) fluid. When viewed in IE, the whole page scrolls and the main content stays below the left column. The right side column next to the left is a blank spot. I apologize for not knowing the proper terminology as I don't know everything, just enough to get by, until I discovered this issue. It may be a simple code to get it to appear the same in both browsers, I honestly don't know. Thank you in advance.
Joe
Browser: firefox
OS: xp
Your web site is made up of at least two different layouts/templates. Your home page, and a couple of other pages, look like the template came from Dynamic Drive CSS Layouts. Specifically, their two columns liquid layout with the left column being static, always in view. I like their layouts and use them myself. Probably, the reason you don't remember where it came from is, you deleted the credits to DynamicDrive. It's pretty easy to tell that that's where it came from. But some of your other pages appear to be from the Website Wizard. I assume you started with the Wizard, but then got tired of the restrictions.
While you do have pieces of the two column layout on your home page, some of the content is outside of the layout. And it look like you may be using pieces from Wizard Theme are carried over into the two column layout.
The two column layouts are pretty simple to work with. They "head" contains a couple of styles for the two main content areas. The "body" then contains the two content areas, "framecontent" and "maincontent". The "framecontent" area is the "static" column on the left and the "maincontent" is the "fluid" column on the right. The "static" column may cause problems if your menu gets any bigger. As it is, it hides some of the menu on my screen.
Generally, as long as you keep your content within the predefined content areas, the layout should work cross browser. But that's were your problems start. On your home page, the "div" for the "static" column is missing and replaced by your navigation menu. Without the "div" wrapped around the menu, it doesn't work well with the other column. Firefox is a little more forgiving than IE, when it comes to layout errors, so it tends to look better.
Here is a link to a example of your home page with the framecontent" and "maincontent" sections fixed. I added a few adjustments to the styles and even added a title, credits at the bottom and an animated favorite icon. It displays pretty much the same in Firefox and IE. The menu grows vertically a little with IE, but not too much.
Here is another example of your home page with a DynamicDrive menu. This gives you a little more control over your navigation menu. There is only a slight font difference between Firefox and IE.
Also note the first couple of lines in the HTML files. There is a comment line at the beginning that forces IE into the quirks mode followed by a "DOCTYPE". Firefox ignored the comment and just sees the "DOCTYPE". Bravenet's Visual Editor may delete these lines. If it does, use the Text Editor to put them back. They are pretty important for making the page cross browser compatible.
You can view everything from my examples by using your right mouse button or by downloading this ZIP File. It contains all the HTML, CSS, and image files from the examples.
Browser: Firefox, Netscape, Sea Monkey, Internet Explorer, .....
OS: Solaris (Sparc,x86), Linux, XP
Hello Philo,
Thank you so much for your assistance, it is greatly appreciated - you made my day! I had a virus recently and lost some items, including my links as to where I acquired that layout. I am not very experienced with the site creation and am learning new stuff daily. I did feel as though Bravenet's wizard was limiting what I wanted to do with my site. I am using a program called Nvu to do my editing now. I am slowly redoing the site, page by page, so that's why some pages reflect my new style and some the old style. I already published your new page and did one other, leaving the credits intact as is rightly so.
One more question, as my novice status can attest to, what do I do with the .css file? I am aware that Bravenet has a css file with my html files, I can delete it from my directory and upload the new one if that is what is required. Conversely, I can continue to add or update one page at a time, changing only the main content. Thank you again for your help,and your time.
Browser: firefox
OS: xp
Your "style.css" file was originally created by the Website Wizard. Once you have replaced all of the pages that were from the Wizard, you do not need that particular file any more. At that point, you can simply delete it. However, that is not to say, you don't need, or should not use, a style sheet.
The intent of a style sheet, separate from your HTML file(s), is for controlling the layout for all your files, from a single style sheet. Lets say, for example, you have 20 pages on your site, and want to adjust the font sizes for all your pages. If you don't use a style sheet, you will need to edit every page on your site. A time consuming and tedious project. But, if all your pages linked to the same style sheet, you only need to make one change in the style sheet, and all your pages will see it.
The layouts at Dynamic Drive CSS Layouts, for simplicity purposes, include style settings within the HTML file. This is certainly a legitimate way to go. But when you start to add content and create multiple pages, and you want them to be similar in appearance, it is best to extract the styles and create a style sheet. This helps simplify what you see in the HTML file.
In the end, it's your choice. Web pages, with styles embedded in the HTML, work just as good as web pages with external style sheets.
Browser: Firefox, Netscape, Sea Monkey, Internet Explorer, .....
OS: Solaris (Sparc,x86), Linux, XP
