Having div problems, would someone be willing to look at my code?

mrongey Peon

Messages:: 8

Likes Received:: 0

Best Answers:: 0

Trophy Points:: 0

#1

I am helping my dad with his site, ask-the-electrician.com. The code is very bloated. Right now I am trying to eliminate extra white space that IE puts in. I know from some research that it is caused by unnecessary div tags. I have fixed some of it but, to be honest I haven't worked with divs very much and don't really know what can be eliminated. Could someone please look at the code that I have and help me learn what can be done to fix it and make it tighter?

Attached Files:

mrongey, Jan 13, 2008 IP

nicangeli Peon

Messages:: 828

Likes Received:: 23

Best Answers:: 0

Trophy Points:: 0

#2

The first thing that I would do is make sure that the site validates at,

The W3 Validator

Then, when you are done with that, post the code using
Your Code Here 
Code (markup):
(it is a pain in the ass to have to download attatchments) and i am sure someone will help remove unnessasary tags.

Nick

nicangeli, Jan 14, 2008 IP

mrongey likes this.

mrongey Peon

Messages:: 8

Likes Received:: 0

Best Answers:: 0

Trophy Points:: 0

#3

Thanks for the tips!

I have fixed all the validation errors. The problem is still there, but I think I see what the problem is. Fixing it will require cosmetic changes in the way the page is organized, so I'm going to run it by my dad before I change it. I will post an update tomorrow.

mrongey, Jan 15, 2008 IP

mrongey Peon

Messages:: 8

Likes Received:: 0

Best Answers:: 0

Trophy Points:: 0

#4

Ok, my idea didn't fix the problem. Here is the code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/main.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<title>Home Wiring and Electrical Installation Projects for the 
Do-It-Yourselfer and Handyman</title>
<!-- Copyright 2005 Macromedia, Inc. All rights reserved. -->
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="description" content="Get Expert Advice You Need to SAFELY and Successfully Complete ALL of Your Do-It-Yourself Home Wiring &amp; Installation Projects from an Electrician with Over 35 Years Experience" />
<meta name="keywords" content="electrical, wiring, home wiring, house wiring, electric, wire, do-it-yourself, electrician, electrical contractor, handyman, handywoman, wiring diagrams, consulting services, home wiring projects, switches, plugs, receptacles, breakers, diagrams, help, advice, instruction, instructions, 3-way switches, 4-way switches, lighting, code, NEC, panels, subpanels, ceiling fan installation, grounding, National Electrical Code, Security Lighting, Energy Saving, Basics of Household Wiring DVD, hot tub wiring, basement wiring, garage wiring" />
<meta name="revisit-after" content="3 days" />
<meta name="robots" content="index, Follow" />
<meta name="language" content="en-us" />
<meta name="classification" content="Ask The Electrician" />
<meta name="Creator" content="www.ask-the-electrician.com" />
<meta name="Publisher" content="www.ask-the-electrician.com" />
<meta name="Distribution" content="US" />
<meta name="Rating" content="daveral" />
<meta name="Author" content="Dave Rongey" />
<meta http-equiv="Content-Language" content="en-us" />

<link rel="stylesheet" href="emx_nav_left.css" type="text/css" />
<script type="text/javascript">
<!--
var time = 3000;
var numofitems = 7;

//menu constructor
function menu(allitems,thisitem,startstate){ 
  callname= "gl"+thisitem;
  divname="subglobal"+thisitem;  
  this.numberofmenuitems = allitems;
  this.caller = document.getElementById(callname);
  this.thediv = document.getElementById(divname);
  this.thediv.style.visibility = startstate;
}

//menu methods
function ehandler(event,theobj){
  for (var i=1; i<= theobj.numberofmenuitems; i++){
    var shutdiv =eval( "menuitem"+i+".thediv");
    shutdiv.style.visibility="hidden";
  }
  theobj.thediv.style.visibility="visible";
}
				
function closesubnav(event){
  if ((event.clientY <48)||(event.clientY > 107)){
    for (var i=1; i<= numofitems; i++){
      shutdiv.style.visibility='hidden';
    }
  }
}
// -->
</script>
<style type="text/css">
<!--
.style1 {font-size: medium}
.style2 {color: #CCCCCC}
.style3 {font-size: 14}
.style4 {font-size: 12}
.style5 {color: #FFFFFF}
.style9 {font-size: large}
.style10 {font-size: small}
.style14 {font-size: small; font-family: Verdana, Arial, Helvetica, sans-serif; }
.style15 {
	color: #006633;
	font-weight: bold;
}
.style18 {color: #990000; font-weight: bold; }
-->
</style>
</head>
<body onmousemove="closesubnav(event);">
<div class="skipLinks">skip to: <a href="#content">page content</a> | <a href="#pageNav">links on this page</a> | <a href="#globalNav">site navigation</a> | <a href="#siteInfo">footer (site information)</a> </div>
<div id="masthead">
  <blockquote>
    <h1 id="siteName"> <a href="http://www.ask-the-electrician.com" class="style5">Ask-The-Electrician.com</a></h1>
  </blockquote>
  <div id="utility"> <a href="terms_of_use.html">Terms of Use </a> | <a href="disclaimer.htm">Legal Disclaimer </a> | <a href="disclaimer.htm">No Spam Policy</a> </div>
  <div id="globalNav"> <img alt="" src="gblnav_left.gif" height="32" width="4" id="gnl" /> <img alt="" src="glbnav_right.gif" height="32" width="4" id="gnr" />
    <div id="globalLink"> <a href="index.htm" id="gl1" class="glink" onmouseover="ehandler(event,menuitem1);">Home</a><a href="Safety_Topics.htm" id="gl2" class="glink" onmouseover="ehandler(event,menuitem2);"> Safety </a><a href="ask_dave.htm" id="gl3" class="glink" onmouseover="ehandler(event,menuitem3);">Ask Dave</a><a href="glossary.htm" id="gl4" class="glink" onmouseover="ehandler(event,menuitem4);">Glossary</a><a href="about.htm" id="gl5" class="glink" onmouseover="ehandler(event,menuitem5);">About Me </a><a href="http://astore.amazon.com/asktheelectr-20" target="_blank" class="glink" id="gl6" onmouseover="ehandler(event,menuitem6);">Store Items </a><a href="Pics_Gallery_1/page_01.htm" target="_blank" class="glink style4" id="gl7" onmouseover="ehandler(event,menuitem7);">Gallery</a></div>
    <!--end globalLinks-->
  </div>
  <!-- end globalNav -->
</div>
<!-- end masthead -->
<div id="pagecell1">
  <!--pagecell1-->
  <img alt="" src="tl_curve_white.gif" height="6" width="6" id="tl" /> <img alt="" src="tr_curve_white.gif" height="6" width="6" id="tr" />
  <div id="breadCrumb"> 
    <p><a href="kitchen.htm"> Kitchen</a> / <a href="bathroom.htm">Bathroom</a> / <a href="bedroom.html" class="style3">Bedroom</a> / <a href="home_office.html"><span class="style3">Home Office</span></a>/ <a href="Lev_Automated_Switching.html">Automation</a> / <a href="Power_Quality.html">Power Quality</a>/ <a href="Emergency_Preparedness.html">Emergency Preparedness</a> </p>
    <p align="center"><img src="pics_site/ate_brnr_2d2w.JPG" alt="Dave Rongey - Electrical Contractor" width="851" height="94" /></p>
  </div>
  <div id="pageName">
    <h3 class="style1">Do-It-Yourself projects for the homeowner...  add value and save money</h3>
  </div>
  <div id="pageNav">
    <div id="sectionLinks"> 
      <p align="center" class="style15"><img src="pics_site/Grass%20Valley.JPG" alt="Grass Valley" width="175" height="146" /> <a href="Grass_Valley.html">Grass Valley,Calif.<br />
      Locals [click here]</a> </p>  
      <p align="center" class="style15"><u><a href="Emergency_Preparedness.html">Winter Storm Watch<br />
        Be Prepaired!</a></u></p>
        
      <p align="center" class="style10"><img src="Pics_Storm/DSC03373_150W.JPG" alt="Winter Storm Damage" width="150" height="144" /></p>
      <p class="style10"><a href="Generator_Guidelines.html"><span class="style18">Generator Information  </span></a><a href="Safety_Topics.htm">Safety</a><a href="http://astore.amazon.com/asktheelectr-20" target="_blank">Electrical Parts </a> <a href="Safety_Topics.htm">Security</a> <a href="#">Home Entertainment </a> <a href="Energy_Effeciency_Lighting_Ctrls.html">Energy Savings </a> <a href="Lev_Automated_Switching.html">Automation</a> <a href="Power_Quality.html">Power Quality </a> </p>
    </div>
    <div class="relatedLinks">
      <h3 class="style9"><span class="style14">Interior<a href="kitchen.htm">Kitchen</a> <a href="bathroom.htm">Bathroom</a> <a href="bedroom.html">Bedroom</a> <a href="#">Living Room </a> <a href="#">Laundry </a> <a href="home_office.html">Home Office</a></span> </h3>
    </div>
    <div class="relatedLinks">
      <h3 class="style1"><span class="style14">Exterior<a href="Safety_Topics.htm">Security</a> <a href="Energy_Effeciency_Lighting_Ctrls.html">Lighting</a> <a href="#">Garage</a> <a href="#">Garden</a> <a href="#">Patio </a> <a href="Power_Quality.html">Utilities</a></span></h3>
      <p align="center"><strong>Dave Recommends:</strong></p>
      <p align="center" class="style1"><a href="Basic_wiring_dvd.html"><img src="pics_Amazon/Wiring-DVD_Case-med.JPG" alt="The_Basics_of_Household_Wiring" width="124" height="171" /></a></p>
      <p align="center" class="style1"><a href="Basic_wiring_dvd.html" class="style15">click here</a></p>
      <p align="center" class="style1">____________</p>
      <form action="sendmail_sub.php" method="post" enctype="multipart/form-data">
        <p align="center">Electrical Tips and Energy Saving ideas.</p>
        <p align="center">FREE Newsletter!<img src="pics_site/Get_Pluged_In.JPG" alt="Get Pluged In" width="162" height="214" longdesc="http://www.ask-the-electrician.com" /> </p>
        <p align="center">
          <label>Name
            <input name="user_name" type="text" id="user_name" />
          </label>
        </p>
        <p align="center">
          <label>Email
            <input name="user_email" type="text" id="user_email" />
          </label>
        </p>
        <p align="center">
          <label>
          <input type="submit" name="Submit22" value="Submit" />
          </label>
        </p>
        <p align="center">Privacy Policy </p>
      </form>
      <p class="style1">&nbsp;</p>
    </div>
    <div id="advert"> 
      <p align="center"><strong>We Support: </strong></p>
      <p align="center"><img src="pics_site/habitat%20for%20humanity.jpg" alt="Habitat For Humanity" width="93" height="117" /></p>
      <p align="center">______</p>
      <p align="center"></p>
<script type="text/javascript"><!--
google_ad_client = "pub-6562303349029411";
//ATE_sidebar
google_ad_slot = "8442261583";
google_ad_width = 160;
google_ad_height = 90;
//--></script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
<p align="center">&nbsp;</p>
    </div>
  </div>
  <div id="content"><!-- InstanceBeginEditable name="Main_Top" -->
    <blockquote>
          <div class="feature">
            <p style="MARGIN-TOP: 0px; MARGIN-BOTTOM: 0px" 
                        align="center">&nbsp;</p>
            <h1 
                        align="left" class="style22" style="MARGIN-TOP: 0px; MARGIN-BOTTOM: 0px">Winter Storm Watch - Be Prepared!</h1>
            <blockquote>
              <p align="left" class="style1  style23" style="MARGIN-TOP: 0px; MARGIN-BOTTOM: 0px">Winter storms can catch us totally unprepared which can leave  us without electricity, telephones and internet connections for days. Below you will see just a few examples of what hit our area during the first weeks of January 2008. </p>
              <p align="left" style="MARGIN-TOP: 0px; MARGIN-BOTTOM: 0px"><span class="style23"><span style="font-size: medium">Will You Be Ready?  Find out more.....</span></span> <span class="style24"><span class="style1 style1"><a href="Winter_Storm.html">[click here] </a></span></span> </p>
              <blockquote>
            <blockquote>
                  <p><img src="Pics_Storm/DSC03458_240H.JPG" alt="Tree Damaged Home" width="320" height="240" class="capsule" /></p>
                </blockquote>
                <p>&nbsp;</p>
                <p>&nbsp;</p>
                <p>&nbsp;</p>
                <p>&nbsp;</p>
                <p>&nbsp;</p>
                <p>&nbsp;</p>
                <blockquote>
                  <p align="left"><br />
                    <span class="style10"><strong><strong>High Winds can cause severe structural damagefrom falling trees and prolonged power outages.</strong></strong></span></p>
                </blockquote>
                <p><span class="style1 style21"><strong>Customer Safety &mdash; Call 911 to report Downed Power Lines</strong></span></p>
                <p class="style1"><strong>Your safety is our first concern.</strong> </p>
                <p>If you see a  downed power line, assume it is energized and keep yourself and others  away. Call 911 immediately to report the location of the downed line then call your local Electric Utility Company 24-Hour Emergency and Customer  Service Line. During and after a storm, please keep away from flooded  areas and downed trees, as these areas could be hiding an energized  power line.</p>
                <p><span class="style15 style1">A Word about Safety and Home Generators -</span><br />
                  Ok, You bought that Portable Generator - Now What?<br />
                  When a  severe storm 
                  hits several people will rush out and purchase a portable generator and really won't have a clue about what to do or how to connect the power. Many load up that prize generator, truck it home and discover that they forgot a few things...<br />
                  <a href="Home_Generators.html">[find out more]</a>                  <br />
                  <br /></p>
              </blockquote>
            </blockquote>
          </div>
          <h1 class="style8 style8">&nbsp;</h1>
    </blockquote>
    <div class="feature">
      <blockquote>
        <h1 class="style1">Generator Selection Guidelines:</h1>
        <p class="style1">The Safety and Security a back-up generator provides is Priceless!</p>
        <p class="style1"> The proper selection of a back-up gerenrator is important to provide reliable power to your essential requirements. </p>
        <p class="style1">Lets look at things to consider when selecting your generator. <a href="Generator_Guidelines.html">[click here]</a></p>
        <p>&nbsp;</p>
        <p>
          <script type="text/javascript"><!--
google_ad_client = "pub-6562303349029411";
//468x60, created 12/7/07
google_ad_slot = "9745824260";
google_ad_width = 468;
google_ad_height = 60;
//--></script>
        </p>
        <p>
          <script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
        </script>
  &nbsp;</p>
      </blockquote>
    </div>
  <!-- InstanceEndEditable --><!-- InstanceBeginEditable name="Main_Mid_Sm" -->
  <blockquote>
    <h1 align="left" class="">&nbsp;</h1>
    <h1 align="left" class="style8"> Home Improvement Project Areas: </h1>
    </blockquote>
  <table width="690" align="center" cellpadding="2" cellspacing="2" summary="">
    <!--DWLayoutTable-->
    <tr valign="top">
      <td width="365" height="169" valign="top" class="storyLeft"><p><a href="kitchen.htm" class="style1 capsule"><strong>Spice up your Kitchen </strong></a></p>
        <p>Enjoy your kitchen with:</p>        <ul>
            <li>Recessed Lighting</li>
          <li>Under Cabinet Lighting</li>
          <li>Microwave Oven </li>
        </ul></td>
      <td colspan="2" valign="top"><p> <a href="bathroom.htm" class="style1 capsule"><strong>Warm up your Bathroom </strong></a> </p>
        <p>Experience Comfort in your bathroom with:</p>        <ul>
            <li>Heat Lamp Exhaust Fan</li>
          <li>Floor Heat</li>
          <li>Jacuzzi Tub </li>
        </ul></td>
    </tr>
    <tr valign="top">
      <td height="169" valign="top" class="storyLeft"><p> <a href="#" class="style1 capsule"><strong>Be Safe &amp; Secure </strong></a></p>
        <p>Additional Safety and Security can be provided with:</p>        <ul>
            <li>Back-Up Generator Power</li>
          <li>Driveway Gate System </li>
          <li>Motion Sensor Lighting </li>
        </ul></td>
      <td colspan="2" valign="top"><p> <a href="bedroom.html" class="style1 capsule"><strong>Add Romance to your Bedroom </strong></a> </p>
        <p>Set the mood with the help of:</p>        <ul>
            <li>Accent Lighting</li>
          <li>Dimmer Controls. </li>
        </ul></td>
    </tr>
    <tr valign="top">
      <td height="148" valign="top" class="storyLeft"><p> <a href="home_office.html" class="capsule style1"><strong>Home Office Productivity </strong></a> </p>
        <p>Enjoy your work with the help of:</p>        <ul>
            <li>Surge Protection for your Data</li>
          <li>Effective Task Lighting</li>
        </ul></td>
      <td colspan="2" valign="top"><p> <a href="#" class="style1 capsule"><strong>Save Energy </strong></a> </p>
        <p>Enjoy lower electric bills:</p>        <ul>
            <li>On demand Water Heater</li>
          <li>Time Clock Control </li>
          <li>Occupancy Sensors </li>
        </ul></td>
    </tr>
    <tr valign="top">
      <td height="190" valign="top" class="storyLeft"><p><a href="#" class="capsule style1"><strong>Workshop Effeciency </strong></a></p>
        <p>An effecient workshop for maximum creativity:</p>        <ul>
            <li>Machinery Circuit Requirements </li>
          <li>Strategic Receptacle Locations</li>
          <li>Safety through proper Lighting </li>
        </ul></td>
      <td width="1">&nbsp;</td>
      <td width="288" valign="top"><p><a href="#" class="style1 capsule"><strong>Laundry Essentials </strong></a></p>
        <p>Necessities for a well dressed family:</p>        <ul>
            <li>Washing Machine Circuit </li>
          <li>Dryer 220 Volt Requirements</li>
          <li>Ironing Area Receptacle</li>
          <li>Wrinkle-Free Lighting Sources </li>
          <li>Mildew Preventing Exhaust Fan</li>
        </ul></td>
    </tr>
  </table>
  <p align="center"><script type="text/javascript"><!--
google_ad_client = "pub-6562303349029411";
//468x60, created 12/7/07
google_ad_slot = "9745824260";
google_ad_width = 468;
google_ad_height = 60;
//--></script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
&nbsp;</p>
  <p align="center"><span class="style1 style1 style19"><span class="style20">Are you ready to get fit  and <u>have fun</u> doing it?</span><br />
      <strong><a href="Healthy_Electrician.html">Take your health to the next level.<br />
Check out the Power 90 System.</a></strong></span></p>
  <!-- InstanceEndEditable --><!-- InstanceBeginEditable name="Main_Btm" -->
  <p>&nbsp;</p>
  <!-- InstanceEndEditable --></div>
  <div id="siteInfo"> 
    <p><a href="index.htm"><img src="pics_site/house3d.JPG" width="119" height="80" border="0" alt="Ask-the-Electrician Home" /></a> <a href="index.htm">Home </a><a href="about.htm"><span class="style2">|</span> Where's Dave | About Us</a> | <a href="proj_req_1.htm">Why e-Books </a> | <a href="disclaimer.htm">Privacy Policy</a> | <a href="ask_dave.htm">Contact Us</a> | &copy;2007 www.Ask-The-Electrician.com</p>
	
<!--adsense for search goes here-->
<p />
<p />
  </div>
</div>
<!--end pagecell1-->
<br />
<script type="text/javascript">
    <!--
      var menuitem1 = new menu(7,1,"hidden");
			var menuitem2 = new menu(7,2,"hidden");
			var menuitem3 = new menu(7,3,"hidden");
			var menuitem4 = new menu(7,4,"hidden");
			var menuitem5 = new menu(7,5,"hidden");
			var menuitem6 = new menu(7,6,"hidden");
			var menuitem7 = new menu(7,7,"hidden");
    // -->
    </script>
</body>
<!-- InstanceEnd --></html>

Code (markup):

mrongey, Jan 15, 2008 IP

Log in or Sign up

Advertising (learn more)

Having div problems, would someone be willing to look at my code?

mrongey Peon

Attached Files:

index.html

nicangeli Peon

mrongey Peon

mrongey Peon

Log in or Sign up

Advertising (learn more)

Having div problems, would someone be willing to look at my code?

mrongey Peon

Attached Files:

index.html

nicangeli Peon

mrongey Peon

mrongey Peon

Useful Searches