Solved

Overhead of div tags

Posted on 2011-09-21
1
230 Views
Last Modified: 2012-05-12
I have recently started a new job and find that the code that I am supporting has an overabundance of superfluous <div> tags.  The attached code is scrubbed and provided only to give an example of the overuse of the tags.  To me it makes the code hard to read and maintain.  My question, however, is what sort of overhead if any this adds to the performance.  Is there any sort of a hit with these tags?

Thanks.
<div id="ctl00_x1">
 <span id="ctl00_x2"></span>
  <div id="ctl00_x3" >
   <div style="width: auto; margin: auto;">
    <div>       
     <div id="ctl00_x4" style="width:60px;">
      <img ...
      <span id="ctl00_x5" style="font-size:XX-Small;">Hide</span>
     </div>
     <div id="ctl00_x6" style="width: 150px;">
      <div id="ctl00_x7" style="text-align: center; background-color: #5377A9; color:white; width:145px; font-weight:bold;" class="Left">
       Test Cell<br />Settings
       <div id="ctl00_x8">
        <table id="LeftTable" cellpadding="0" ...
       </div>
      </div>
     </div>
     <div id="ctl00_x9" style="width:60px;">
      <img ... 
      <span id="ctl00_x10" style="font-size:XX-Small;">Hide</span>
     </div>
     <div id="ctl00_x11" style="width: 150px;">
      <div id="ctl00_x12" style="text-align: center; background-color: #5377A9; color:white; width:145px; font-weight:bold;" class="Left">
        Test<br />Settings
       <div id="ctl00_x13">
        <table ...>
       </div>
      </div>
     </div>
    </div>
    <br />        
   </div>  
  </div> 
 </div>

Open in new window

0
Comment
Question by:TimAttaway
1 Comment
 
LVL 3

Accepted Solution

by:
woepwobin earned 250 total points
ID: 36575834
I wouldn't expect any measurable difference with, say, half the number of <div> tags.

But of course if you van reach the same design-goal with less <div> tags that would help maintainability.
0

Featured Post

Best Practices: Disaster Recovery Testing

Besides backup, any IT division should have a disaster recovery plan. You will find a few tips below relating to the development of such a plan and to what issues one should pay special attention in the course of backup planning.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Zoom the page when you go in from your phone 3 54
help squeezing some space out in this site 9 33
Javascript_Set_dropdown_value 7 33
Scroll 5 news at a time. 4 27
This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

810 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question