Hey guys. Ive been working on a site for about 3weeks now. I got to preview it on Dreamweaver 8 for IE with no problem (everything looks the same). However, he problem is that when I go to preview for firefox, the site looks all messed up. I dont know what the problem could be. Anybody have any suggestions?
You can do a screen capture of when you view it in Firefox if you haven't upload the page yet. That way we get an idea of what might be the problem
thx for the advice jose. This is a picture on IE 6.0 ww w.putfile.com/pic.php?img=3397086 This is a picture on Firefox 1.5 ww w.putfile.com/pic.php?img=3397085 I broke up www. because I cant post a link yet.
You are using DIV tags right, you are not using tables? I think it might be that that the width attribute might not be defined, try that i'm not really good at this yet, so if it doesn't work you might want another opinion.
ok this happens on each page of my site but heres the code to the main page (index.html). <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="author" content="Eniva.com and Emmanuel Rojas" /> <meta name="keywords" content="eniva | eniva vibe | eniva corporation | eniva opportunity | eniva products | eniva scam | eniva supplement | eniva testimonials"/> <meta name="description" content="Eniva Vibe is an all in one Liquid Vitamin Nutrition Supplement. This excellent Vibe Supplement gives you the best business opportunity teamed up with Eniva Corporation. The Eniva products have created a great opportunity for Eniva Distributors to make money and improve their health." /> <link rel="stylesheet" type="text/css" href="GScape.css" media="screen"/> <title>Eniva Vibe | Eniva Corporation | Eniva Opportunity</title> <style type="text/css"> <!-- body { background-color: #EAEAEA; } .style1 {color: #000000} body,td,th { color: #000000; } .style2 {color: #FFFFFF} .style3 {font-size: 150%} .style9 {font-size: 140%} .style10 { color: #000000; font-size: 120%; } .style11 {color: #FF6600} .style13 {color: #FF6600; font-size: 120%; } .style20 {font-size: 95%} .style21 {font-family: Geneva, Arial, Helvetica, sans-serif} .style22 { font-family: Geneva, Arial, Helvetica, sans-serif; font-size: 115%; } .style23 {font-size: 125%; } .style30 {font-family: Perpetua; font-size: 250%; color: #FF6600; } .style31 { font-size: 175%; font-weight: bold; } .style33 { font-size: 250%; font-family: Perpetua; } .style34 {color: #FF0000} .style35 {font-size: 120%; } --> </style></head> <body> <div id="MainWrapperBlack"> <div id="WrapperGray"> <div id="Header"> <h1 align="center" class="style2" id="Shadow">Eniva</h1> <h2 align="center" class="style1">An Eniva VIBE Distributor</h2> <div id="HeaderMenus"> <ul> <li><a class="selected" href="index.html">Home</a></li> <li><a href="index2 - company.html">Company</a></li> <li><a href="index3 - product.html">Product</a></li> <li><a href="index4 - opportunity.html">Opportunity</a></li> <li><a href="index5 - testimonials.html">Testimonials</a></li> <li><a href="index6 - order vibe.html">Order VIBE</a></li> <li><a href="index7 - contact us.html">Contact Us</a></li> </ul> </div> </div> <div id="RightColumn"> <!-- For the rounded corners --> <div id="LoginTopRight" class="TopRight"></div> <div id="LoginTopLeft" class="TopLeft"></div> <div id="Login" class="RightContents"> <h4> <img src="../Information/Images/VibeBottle4.jpg" alt="Eniva Opportunity graphic" width="83" height="138" align="middle" longdesc="Eniva image" /></h4> <div align="center" class="style3">Order Today </div> </div> <!-- For the rounded corners --> <div id="LoginBottomRight" class="BottomRight"></div> <div id="LoginBottomLeft" class="BottomLeft"></div><br/> <div id="RightOneTopRight" class="TopRight"></div> <div id="RightOneTopLeft" class="TopLeft"></div> <div id="RightOne" class="RightContents"> <h3>StrongVibe Blog</h3> <p>The StrongVibe blog provides many ideas and resources useful to all members. Come and read the posts to learn more about Eniva and network marketing. Click Here. </p> <h3>StrongVibe Forum</h3> <p>Still not sure about joining? Join the forum and talk to current members. It's a great place to meet your team and exchange ideas. Don't waste time! Click Here.</p> </div> <div id="RightOne" class="RightContents"> <div align="center"><span class="style9">Eniva Tour</span> </div> <p> </p> <div align="center" class="style10 style1"><a href="http://www.eniva.com/products/le_vibe_NEW1.html"><span class="style11">Liquid Nutrition</span></a></div> <p> <img src="../Information/Images/BestPath1.jpg" alt="Eniva Products image" width="95" height="95" /></p> <div align="center"><a href="http://www.eniva.com/products/le_vibe_NEW2.html"><span class="style13">VIBE Ingredients</span></a></div> <p> <img src="../Information/Images/BestPath2.jpg" alt="Eniva Opportunity graphic" width="95" height="95" /></p> <div align="center"><a href="http://www.eniva.com/products/le_vibe_NEW3.html"><span class="style13">VIBE Essential</span></a></div> <p> <img src="../Information/Images/BestPath3.jpg" alt="Eniva Corporation image" width="95" height="95" /></p> <div align="center"><a href="http://www.eniva.com/products/le_vibe_NEW4.html"><span class="style13">VIBE Science</span></a></div> <p> <img src="../Information/Images/BestPath4.jpg" alt="Eniva Products graphic" width="95" height="95" /></p> </div> <div id="RightOne" class="RightContents"> <div align="center" class="style9">Eniva International </div> <p> <a href="http://www.eniva.com/products/le_vibe_NEW1.html"> <span class="style2">Enia</span></a></p> <p><span class="style20">If you live outside the U.S. but still interested in joining, click the appropriate link to learn more about how you can be part of the team.</span></p> <div align="center"><a href="http://www.eniva.com/opportunities/enivagold.aspx#income"><strong>Puerto Rico</strong></a> </div> <p> <img src="images/Puerto Rico Flat.png" alt="Eniva Vibe image" width="120" height="75" align="middle" /></p> <div align="center"><a href="http://www.eniva.com.mx/"><strong>Mexico</strong></a> </div> <p align="center"> <img src="images/Mexico Flag.png" alt="Eniva Corporation graphic" width="120" height="75" /></p> <div align="center"><a href="http://www.eniva.com/canada.html"><strong>Canada</strong></a> </div> <p align="center"> <img src="images/Canada Flag.png" alt="Eniva Opportunity image" width="120" height="75" /></p> <div align="center"><a href="http://www.enivabermuda.com/"><strong>Bermuda</strong></a></div> <p> <img src="images/Bermuda Flag.png" alt="Eniva graphic" width="120" height="75" /></p> </div> <div id="RightOne" class="RightContents"> <div align="center" class="style9">Compensation Plan </div> <p> <a href="http://www.eniva.com/products/le_vibe_NEW1.html"> <span class="style2">Enia</span></a></p> <p><span class="style20">The following links provide you with Eniva's 21 Days to Extra Pay and full information on their compensation plan. Read about it here:</span></p> <a href="../Information/Documents/21days.pdf" class="style35">21 Days to Extra Pay</a> <p> <a href="../Information/Documents/Eniva Gold Comp Plan.pdf" class="style23">Gold Compensation Plan</a></p> </div> <div id="RightOneBottomRight" class="BottomRight"></div> <div id="RightOneBottomLeft" class="BottomLeft"></div><br/> <div id="RightTwoTopRight" class="TopRight"></div> <div id="RightTwoTopLeft" class="TopLeft"></div> <div id="RightTwo" class="RightContents"> <h3>Helpful Links </h3> <p><a href="http://mlm.com/mlm/user/listthreads?forum=4">Eniva Site</a><br/> <a href="http://openwebdesign.org/">StrongVibe Blog</a><br/> <a href="http://www.4templates.com/">StrongVibe Forum</a><br/> <a href="http://www.4templates.com/">StrongVibe SupportSite</a><br/> </p> </div> <div id="RightTwo" class="RightContents"> <h3>Contact Information</h3> <pre class="style21"><span class="style22">Eniva # Emmanuel Rojas Phone: 631-645-4626 Email: <a href="mailto:info@strongvibe.com">info@strongvibe.com</a></span></pre> </div> <div id="RightTwoBottomRight" class="BottomRight"></div> <div id="RightTwoBottomLeft" class="BottomLeft"></div> </div> <div id="LeftContainer"> <div id="LeftContents"> <div id="LeftOneTopRight" class="TopRight"></div> <div id="LeftOneTopLeft" class="TopLeft"></div> <h2>WELCOME TO STRONGVIBE.COM! </h2> <div id="LeftOneBottomRight" class="BottomRight"></div> <div id="LeftOneBottomLeft" class="BottomLeft"></div> <p align="left" class="style23"><span class="style30">World Leader in Nutrient Delivery </span> </p> <p><span class="style1">VIBE is a complete formula that consists of the best vitamins, minerals, and potent phytonutrients combined with green tea, aloe vera, natural fruits, and vegetables. This proprietary blend of solubilized nutritional vitamins is built to support, boost, and recharge healthy body systems. This isn't your ordinary fruit juice or health drink! Better yet, this astonishing liquid vitamin supplement is making a lucrative home business opportunity teamed</span> <span class="style1">with Eniva Corporation and the rest of the Eniva Products.</span></p> <p><span class="style1">VIBE is the most comprehensive solution to the body’s demand for life-giving nutrients. This “all-in-one†supplement supplies a convenient, great tasting, economical, and powerful way to receive balanced nutrition for vibrant living. A</span> <span class="style1">more complete, established mixture of healthful goodness in liquid design can’t be found.</span></p> <p><span class="style1">The specialized processes and nutritional vitamins and minerals included into VIBE Liquid Vitamin Supplement provides for greater nutrient delivery and digestion for the proper foundation for lifelong energetic living. Angstrom-sized, ionic, and bio-available liquid nutrition that can attain cellular absorption within minutes!</span></p> <p>________________________________________________________________</p> <table width="515" border="0"> <tr> <td><div align="center"><span class="style33">The Potency of One Ounce of VIBE</span></div></td> </tr> </table> <p> </p> <table width="515" border="0"> <tr> <td width="252"><p><img src="images/Tomatoes.jpg" alt="Eniva Ingredients image" width="202" height="135" /></p> <p><span class="style34">13 tomatoes</span><br /> <span class="style1">Vitamin A</span></p></td> <td width="253"><p><img src="images/Peaches.jpg" alt="Eniva Product graphic" width="202" height="135" /></p> <p><span class="style34">20 peaches</span><br /> <span class="style1">Vitamin C</span></p></td> </tr> <tr> <td><p><img src="images/Mangos.jpg" alt="Eniva Opportunity image" width="202" height="135" /></p> <p><span class="style34">15 raw mangos</span><br /> <span class="style1">Vitamin E</span></p></td> <td><p><img src="images/Walleye Fillets.jpg" alt="Eniva Vibe graphic" width="202" height="135" /></p> <p><span class="style34">25 fresh walleye fillets</span><br /> <span class="style1">Calcium</span></p></td> </tr> <tr> <td><p><img src="images/Green Beans.jpg" alt="Eniva Corporation image" width="202" height="135" /></p> <p><span class="style34">10 cups raw green beans</span><br /> <span class="style1">Folate</span></p></td> <td><p><img src="images/Green Tea.jpg" alt="Eniva Products image" width="202" height="135" /></p> <p><span class="style34">2.5 cups Green Tea</span><br /> <span class="style1">(EGCG Content)</span></p></td> </tr> <tr> <td><p><img src="images/Beef Steaks.jpg" alt="Eniva Opportunity graphic" width="202" height="135" /></p> <p><span class="style34">5 6 oz. beef steaks</span><br /> <span class="style1">Magnesium</span></p></td> <td><p><img src="images/Aloe Vera.jpg" alt="Eniva Vibe image" width="202" height="135" /></p> <p><span class="style34">10% Aloe Vera</span><br /> <span class="style1">Aloe Vera Gel</span></p></td> </tr> <tr> <td><p><img src="images/Wheat Slices.jpg" alt="Eniva Corporation graphic" width="202" height="135" /></p> <p><span class="style34">13 cracked wheat slices</span><br /> <span class="style1">Zinc</span></p></td> <td><p><img src="images/Cherries.jpg" alt="Eniva Opportunity graphic" width="202" height="135" /></p> <p><span class="style34">35 cherries</span><br /> <span class="style1">ORAC Score</span></p></td> </tr> </table> <p>________________________________________________________________</p> <p><span class="style1">Brunswick Laboratories (Wareham, MA) have conducted official testing of the antioxidant capacity of leading liquid nutritional supplements. Brunswick Laboratories is the premier ORAC testing facility in the nation. It is an independent, third-party analytical laboratory and does not endorse products.</span></p> <p><span class="style1">Brunswick tested the following products for their hydrophilic oxygen radical absorbance capacity (ORAC). Check out these results! </span></p> <table width="515" border="1"> <tr> <td height="36"><div align="center" class="style31">ORAC Value Score Summary</div></td> </tr> </table> <table width="515" border="1"> <tr> <td width="162"><span class="style23">Product</span></td> <td width="162"><div align="center"><span class="style23">ORAC Score/oz. (29.57 ml) </span></div></td> <td width="169"><div align="center"><span class="style23">ORAC Score/Bottle (32 oz.)</span> </div></td> </tr> <tr> <td><span class="style11">Eniva Vibe™†</span></td> <td><div align="center" class="style11">2,600</div></td> <td><div align="center" class="style11">83,200</div></td> </tr> <tr> <td>YL Berry Young Juice™†</td> <td><div align="center">1000</div></td> <td><div align="center">32,000</div></td> </tr> <tr> <td>Xango Juice™¥</td> <td><div align="center">530</div></td> <td><div align="center">16,960</div></td> </tr> <tr> <td>Goji Juice™†</td> <td><div align="center">380</div></td> <td><div align="center">12,160</div></td> </tr> <tr> <td>Noni Juice†</td> <td><div align="center">165</div></td> <td><div align="center">5,280</div></td> </tr> <tr> <td>Sea Silver™†</td> <td><div align="center">90</div></td> <td><div align="center">2,880</div></td> </tr> </table> <p><span class="style1">Notes:<br /> †Test conducted on a single sample of unopened retail product<br /> Â¥ Test conducted on more than one sample of unopened</span> <span class="style1">retail product</span></p> </div> </div> <div id="LeftColumnFill" class="Fill"></div> <div class="style1" id="Footer"> Copyright © 2006 www.StrongVibe.com Eniva Vibe distributor</div> </div> </div> </body> </html>
I use space to center objects b/c i cant get the center button to center the pictures. Btw, im using a template I found online. All I did was change the header, etc, nothing major.
Bestmiller, Learn how CSS and HTML works, and code everything by hand. It will make your life a whole lot easier in the long run.
Too many useless CSS tags in there. Open up your CSS file and look for the div tag that has the largest width or 100%, and edit that. What you are seeing has nothing to do with your HTML file.
hey fatinfo guy. I looked at my css file and searched for the largest width. However there are a few with really large widths. Not sure which to modify. Heres a copy: /*Style sheet for GScape must be included to with HTML.*/ /*Styles for body.*/ body { margin:0 auto; padding:0; font:76% Verdana, Helvetica, Tahoma, Arial, sans-serif; background-color:#6B74AE;/*#7B82B7;*//*#F2F3F7;*//*#626294;*//*#575F9F;*/ color:#000000; background-attachment: fixed; } /*Styles for main content which will be wrapped to centere with a black border. */ #MainWrapperBlack { margin:0 auto; width:751px; background-color:#ffffff;/*#37127b;*/ } /*Styles for main content which will be wrapped to centere with a gray border inside balck border. */ #WrapperGray { margin:0 auto; padding:5px 5px 5px 5px; width:737px; background-color:#ffffff; border:solid 2px #cccccc;/*#D9D9D9;*/ } /*Styles for the main header at the top. */ #Header { margin:0 0 10px 0; height:144px; background:#ffffff url(images/header.jpg) top left no-repeat; font-family:Verdana, Helvetica, Arial, sans-serif; } #Header h1 { margin:0 auto; padding:10px 0 0 21px; color:#000000; font-size:4em; font-weight:normal; font-family:inherit; } #Header h2 { margin:0 auto; padding:4px 0 0 22px; color:#000000; font-size:1.6em; font-weight:normal; } /*Styles for the Title of the page with shadow effect. */ #Title { margin:-72px 0 0 0; padding:10px 0 0 19px; background-color:Transparent; } #Title a { color:#ffffff; text-decoration:none; background-color:inherit; font-size:4em; font-weight:normal; font-family:inherit; } /*Styles for the main header menus. */ #HeaderMenus { padding-left:11px; height:1.2em; line-height:1.2em; color:#000000; } #HeaderMenus ul { margin:22px 0 0 0; padding:0 0 0 0; color:#000000; } #HeaderMenus li { color:#000000; list-style-type:none; float:left; } #HeaderMenus li a { padding:0 10px 14px; display:block; text-decoration:none; color:#000000;/*#2f4fab;*//*#660066;*//*#22527B;*//*#73227B;*/ font-size:1.5em; font-family:Geneva, Arial, Helvetica, sans-serif; } #HeaderMenus a:hover { text-decoration:none; color:#ff6633; } #HeaderMenus .selected { color:#000000; } /*Styles for the right columms. */ #RightColumn { margin:0 auto; padding:0 0 0 0; width:26%; float:right; } /*Styles for the Login Button in the right column. */ #LoginSubmit { margin:4px 0; border:1px solid #899aba; text-align:center; font-size:0.9em; } /*Styles for the container that wrappas the contents to left side. */ #LeftContainer { margin: 0 186px 0 0; } /*Styles for the main contets in the page. */ #LeftContents { padding: 0 20px 0 12px; line-height: 1.6em; background-color: #FFFFFF; background-position: center center; position: fixed; } #LeftContents h2 { margin:0 auto; padding:4px 0 4px 0; background-color:#FEFEFE;/*#E8ECF5*//*#E7E9F1;*/ font-family: "Book Antiqua", Helvetica, Tahoma, Arial, sans-serif; border:1px solid #899aba; text-align: left; color:#000000; font-size: 1.6em; } #LeftContents p { background-color:#FFFFFF; text-align: justify; color:#494949; } #LeftContents a { background-color:inherit; text-decoration: none; color: #000080; } #LeftContents img { background-color:inherit; color: inherit; } /*Styles for the page footer. */ #Footer { margin:6px 0 0 0; padding:4px 0 4px 11px; background-color:#EAEAEA;/*#E8ECF5*//*#E7E9F1;*/ border:solid 1px #000000; text-align:left; color: #000000; } #Footer a { background-color: inherit; text-decoration: underline; color:#ffffff; } /*The general classes used throughout the page. */ /*Classes for adding the rounded corner images. */ .TopRight { float:right; height:11px; width:11px; background-repeat:no-repeat; background-image:url(images/CrTopRight.gif); } .TopLeft { float:left; height:11px; width:11px; background-repeat:no-repeat; background-image:url(images/CrTopLeft.gif); } .BottomRight { margin:-11px 0 0 0; float:right; height:11px; width:11px; background-repeat:no-repeat; background-image:url(images/CrBottomRight.gif); } .BottomLeft { margin:-11px 0 0 0; float:left; height:11px; width:11px; background-repeat:no-repeat; background-image:url(images/CrBottomLeft.gif); } /*The general class for the contents in the right column. */ .RightContents { margin:0 auto; padding:8px 7px 8px 7px; background-color:#FEFEFE;/*#E8ECF5*//*#E7E9F1;*/ border:1px solid #899aba; line-height:1.4em; } .RightContents h3 { margin: 5px 0 0 0; padding: 0 0 8px 0; background-color:inherit; color:#000000;/*#4D4D4D;*/ text-align:left; font-size: 1.3em; /*font-family: Fantasy, Helvetica, Arial;*/ } .RightContents h4 { font-size: 1em; margin: 5px 0 0 0; background-color:inherit; } .RightContents p { margin: 0 0 14px 0; text-align: justify; background-color:inherit; color: #000000; font-size: 90%; } .RightContents a { background-color:inherit; text-decoration: none; color: #000066; } /*The class for comments in the main contents. */ .Comments { background:inherit; border-top:solid 1px #dcdcdc; border-bottom:solid 1px #dcdcdc; text-align:right; color: #000000; font-size:1em; } /*Classes for aligning the images in the main conetes. */ .AlignLeft { margin: 10px 10px 5px 0; float: left; } .AlignRight { margin: 10px 0 0 10px; float: right; } /*Class filling the left column. */ .Fill { margin:0; clear:both; }
The easiest way to learn is to edit the width fields in the CSS and preview in Firefox. If you are using Dreamweaver as in your original post, this should be easy.
so edit each single one until i get the right one? I played around with the width and that wasnt the problem. How about the margin?