Click here to Skip to main content
15,889,527 members
Home / Discussions / Web Development
   

Web Development

 
GeneralRe: Writing text file in Visual studio .net 2003 Pin
Junior Boy22-May-07 20:45
Junior Boy22-May-07 20:45 
GeneralRe: Writing text file in Visual studio .net 2003 Pin
Expert Coming22-May-07 20:55
Expert Coming22-May-07 20:55 
GeneralRe: Writing text file in Visual studio .net 2003 Pin
Junior Boy22-May-07 21:39
Junior Boy22-May-07 21:39 
GeneralRe: Writing text file in Visual studio .net 2003 Pin
Expert Coming22-May-07 21:51
Expert Coming22-May-07 21:51 
GeneralRe: Writing text file in Visual studio .net 2003 Pin
Junior Boy22-May-07 22:10
Junior Boy22-May-07 22:10 
GeneralRe: Writing text file in Visual studio .net 2003 Pin
DavidNohejl22-May-07 23:43
DavidNohejl22-May-07 23:43 
GeneralRe: Writing text file in Visual studio .net 2003 Pin
Junior Boy22-May-07 23:51
Junior Boy22-May-07 23:51 
GeneralRe: Writing text file in Visual studio .net 2003 Pin
DavidNohejl23-May-07 0:41
DavidNohejl23-May-07 0:41 
GeneralRe: Writing text file in Visual studio .net 2003 Pin
Expert Coming23-May-07 9:14
Expert Coming23-May-07 9:14 
GeneralRe: Writing text file in Visual studio .net 2003 Pin
Junior Boy23-May-07 20:54
Junior Boy23-May-07 20:54 
GeneralRe: Writing text file in Visual studio .net 2003 Pin
Paddy Boyd24-May-07 2:58
Paddy Boyd24-May-07 2:58 
GeneralRe: Writing text file in Visual studio .net 2003 Pin
Junior Boy24-May-07 20:46
Junior Boy24-May-07 20:46 
Questioniframes and ie Pin
eggsovereasy22-May-07 11:02
eggsovereasy22-May-07 11:02 
QuestionNeed Help with Apache installation Pin
Evgeni5722-May-07 10:14
Evgeni5722-May-07 10:14 
QuestionGet time Pin
matjame22-May-07 4:06
matjame22-May-07 4:06 
AnswerHow to put a clock on a webpage (Dreamweaver / Flash not requred!) Pin
Fred_Smith22-May-07 5:01
Fred_Smith22-May-07 5:01 
GeneralRe: How to put a clock on a webpage (Dreamweaver / Flash not requred!) Pin
matjame23-May-07 0:50
matjame23-May-07 0:50 
GeneralRe: How to put a clock on a webpage (Dreamweaver / Flash not requred!) Pin
Fred_Smith23-May-07 1:12
Fred_Smith23-May-07 1:12 
AnswerRe: Get time Pin
Expert Coming22-May-07 10:58
Expert Coming22-May-07 10:58 
AnswerRe: Get time Pin
JimmyRopes22-May-07 11:20
professionalJimmyRopes22-May-07 11:20 
QuestionIt's a Wonder... Pin
#realJSOP22-May-07 3:04
mve#realJSOP22-May-07 3:04 
... that the web works at all.

Before reading the following, keep in mind that I'm not very experienced at coding web pages. I come from a C++ background and I like the order and discipline the language imposes on the programmer. When coding web pages, you can pretty much toss all that discipline out the window because it generally doesn't do you any good at all. I hate that. This is more a tale of woe than a question, so just sit back, grab a soda, and laugh along with me.

I've been working on a "classic" ASP web site that combines html, vbscript, css, and javascript. It displays just fine, but the VS2005 IDE indicated several "errors", indicated by the annoying red underscore. Yesterday, I decided to try to bring one of the site's web pages into strict compliance with what the vs2005 IDE thinks is "good form". Everything was going fine until I got to the table cell background image stuff.

The site itself is composed of a frameset, and all of the content is based on a nested table structure. The outermost table on every page is decorated by a series of images that display a graphic frame around the data. Personally, I think the graphic frame eats up way too much screen real estate (and it looks like something a VB programmer would come up with), but (unfortunately) I have not been tasked with eliminating or improving it. The programmer that originally coded the site used the following general table definition to display the border:

<table width="700" cellpadding="0" cellspacing="0" id="table1">
    <tr valign="top">
	    <td width="30" ><img src="img_tl.jpg" alt="" border="0" /></td>
	    <td width="331"><img src="img_tab.gif" alt="" border="0" /></td>
	    <td style="background-image:url('img_tm.jpg');background-repeat:repeat-x;" width="100%"></td>
	    <td width="15" ><img src="img_tr.jpg" alt="" border="0" /></td>
    </tr>
    <tr>
    	<td width="30" background="img_sl.jpg"></td>
    	<td colspan="2" width="100%">
    	<td width="30" background="img_sr.jpg"></td>
    </tr>
    <tr>
	    <td width="30" ><img src="img_bl.jpg"></td>
	    <td colspan="2" width="662" background="img_bm.jpg"</td>
	    <td width="15" ><img src="img_br.jpg"></td>
    </tr>
</table>


This displayed just fine, but the IDE complained about the width= and background= elements, so I went about replacing them with appropriate style code in the site's css file. The code shown above now looks like this:

<table width="700" cellpadding="0" cellspacing="0">
    <tr>
	    <td class="BorderBlueTopLeft"</td>
	    <td class="BorderBlueTopTab"</td>
	    <td class="BorderBlueTopMid"  valign="middle"><b>Title</b></td>
	    <td class="BorderBlueTopRight"</td>
    </tr>
    <tr>
    	<td class="BorderBlueSideLeft"</td>
    	<td colspan="2">
        <td class="BorderBlueSideRight"</td>
    </tr>
    <tr>
	    <td class="BorderBlueBottomLeft"</td>
	    <td class="BorderBlueBottomMid" colspan="2"</td>
	    <td class="BorderBlueBottomRight"</td>
    </tr>
</table>


The widths and background images are now specified in the indicated css classes (the widths were dictated by the width of the images, and the repeat stuff was dictated by the intended positioning of the class), and the code is much more readable. The real problems arose after I started plugging the missing code back into the improved general table layout.

Not counting the left/right border columns, the outermost table essentially contained a middle cell (colspan=2) which contained it's own table. That inner table had a single row with two columns, and within each of those columns was an additional inner table. Sprinkled throughout this nested table structure were width specifications for given columns as well as widths for the tables themselves. Believe me when I say it was a mess, and I spent a day trying to figure out why crazy crap was happening all of the page. Apparent gaps between columns, the inner-most tables rendering in varying and bizarre sizes, the graphic borders not showing up or showing up where they shouldn't be.

No, there weren't any open tags. I wasn't missing any quote marks or semi-colons, or any of the typo stuff you normally find after you've been typing too fast for a few hours. I was really struggling, and even a couple of guys in the office that had more experience than me could not get a grip on what was happening. The comedy ensued for several hours as we changed random elements trying to get the tables to display correctly.

This morning, after fighting with it for an hour or so, I decided to try putting a div inside each cell that contained a table, and specifying that the div was 100% of the containing cell size. The table that was contained in the cell was now enclosed by a div. When I ran the page, everything snapped neatly into place, and all is now right with the world.

I'm really surprised that web pages work at all, and that the web hasn't exploded in a spectacular fire ball. It appears as if all standards for coding a web site are merely whispered guidelines that can be used or ignored on a whim. No wonder the browsers are all so big and bloated - they have to allow what amounts to crap to be rendered just as well as the properly formed stuff.



The moral of this story: If you're nesting tables, make sure you enclose each nested table within a div. The div becomes the parent element, and sizes specified in percentages appear to work every time.

Moral #2: Get back to real programming as soon as you can possibly arrange it - this web stuff is nuts.





"Why don't you tie a kerosene-soaked rag around your ankles so the ants won't climb up and eat your candy ass..." - Dale Earnhardt, 1997
-----
"...the staggering layers of obscenity in your statement make it a work of art on so many levels." - Jason Jystad, 10/26/2001


AnswerRe: It's a Wonder... Pin
Fred_Smith22-May-07 3:35
Fred_Smith22-May-07 3:35 
AnswerRe: It's a Wonder... Pin
Shog922-May-07 6:44
sitebuilderShog922-May-07 6:44 
AnswerRe: It's a Wonder... Pin
Guffa22-May-07 13:32
Guffa22-May-07 13:32 
QuestionSending email in Inbox Pin
Lalafaraz21-May-07 23:38
Lalafaraz21-May-07 23:38 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.