...

View Full Version : does <div class ="x"> not need to be closed?



xelawho
02-22-2011, 04:27 PM
Hi,

this isn't really so much of a problem as just a question that is confusing me.

I assume that using <div class ="x"> sets up a new div, so I have always closed it with a </div>

but the validator tells me that I am closing a div that is not open.

And when I wanted to nest an absolutely positioned div inside a floated left one, I changed this:



CSS:
.control {
font-family: Arial, Helvetica, sans-serif;
font-size:15px;
float:left;
margin:10px;
}

#results {
z-index: 100;
font-family: Arial, Helvetica, sans-serif;
background-color: white;
}

HTML:
<div class="control" id="results">
<table id="featuretable">
<tbody id="featuretbody">
</tbody>
</table>
</div>


to this:



CSS:
.control {
font-family: Arial, Helvetica, sans-serif;
font-size:15px;
float:left;
margin:10px;
}

#results {
position:absolute;
z-index: 100;
font-family: Arial, Helvetica, sans-serif;
background-color: white;
}

HTML:
<div class="control">
< div id="results">
<table id="featuretable">
<tbody id="featuretbody">
</tbody>
</table>
</div>
</div>


which totally threw out the layout until I took out that last </div>, at which point everything fell into place... is there something I'm missing here? thanks for any tips...

abduraooft
02-22-2011, 04:44 PM
Please post your complete code a link to your page. The error might be somewhere else.

xelawho
02-22-2011, 04:49 PM
sure. it's here (http://www.xelawho.com/map/)

kansel
02-22-2011, 05:14 PM
Count the opening and closing div tags in your body. There are 30 opening tags and 31 closing tags. These number should be equal. Code matching indicates the very last </div> is not needed. Did you remove part of a div somewhere and forget to remove its closing tag?

xelawho
02-22-2011, 05:26 PM
quite likely.

but (from what I can tell) that end div isn't the problem... because (and here's where it gets weird) if I take it out, the minimap (click on a category on the right, click on a name, in the infowindow tab click on location), which is created by this code:


var marker2 = new google.maps.Marker(point, { icon:gicons[category], clickable:false});
var tab1 = new google.maps.InfoWindowTab("Info", html);
var tab2 = new google.maps.InfoWindowTab("Location", '<div id="detailmap">');
var infoTabs = [tab1,tab2];
marker.openInfoWindowTabsHtml(infoTabs, {maxWidth: '250'});
var dMapDiv = document.getElementById("detailmap");
var detailMap = new GMap2(dMapDiv,{size:new GSize(250,150)});
detailMap.setCenter(point, 16);
detailMap.setMapType(G_MAPMAKER_NORMAL_MAP);
detailMap.addControl(new GSmallMapControl());
var CopyrightDiv = dMapDiv.firstChild.nextSibling;
var CopyrightImg = dMapDiv.firstChild.nextSibling.nextSibling;
CopyrightDiv.style.display = "none";
CopyrightImg.style.display = "none"
detailMap.addOverlay(marker2);
marker.show();
});


disappears (but only in IE), and the only way to get it back is by adding that seemingly useless end tag... :confused:

kansel
02-22-2011, 05:54 PM
I'm not familiar with the code, but why do you have an opening div tag in tab2 and where is its closing tag?
var tab2 = new google.maps.InfoWindowTab("Location", '<div id="detailmap">');
I assume this code is to be inserted into the DOM. You should probably insert the closing tag also instead of leaving it in the raw HTML - then at least the validator would ignore it.

xelawho
02-22-2011, 06:44 PM
yeah, tried that. Doesn't do anything just doing that, and if I do that and remove that hanging closing tag I get the minimap problem described above...

:confused:

but I closed it up anyway, just to keep things nice...

Excavator
02-22-2011, 07:49 PM
Hello xelawho,
Maybe the validator will help you. See the links about validation in my signature line below.


http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.xelawho.com%2Fmap%2F



.

xelawho
02-22-2011, 07:56 PM
Hello Excavator - unfortunately not. The only div references in the validator are to two closing divs - one that I added after kansel's suggestion and the other that I talk about above, that is needed to make the minimap work in IE.

no big deal. if it works cross-browser, it works. I don't really need to understand why. :rolleyes:

One thing I've been wondering for a while, though - that "splelchecker" in your sig line... that's meant to be ironic, right?

Excavator
02-22-2011, 08:13 PM
Hello Excavator - unfortunately not. The only div references in the validator are to two closing divs - one that I added after kansel's suggestion and the other that I talk about above, that is needed to make the minimap work in IE.

Invalid code is still invalid, whether it works or not.

xelawho
02-22-2011, 08:52 PM
Invalid code is still invalid, whether it works or not.

absolutely. And I'd love to make it valid, but it stops working if I do... :confused::confused:

Excavator
02-22-2011, 09:04 PM
I think since it's .js, this line #340 should not have <div></div> in it. Something more like this maybe - var tab2 = new google.maps.InfoWindowTab("Location", 'detailmap');

Excavator
02-22-2011, 09:09 PM
...
disappears (but only in IE), and the only way to get it back is by adding that seemingly useless end tag... :confused:

If you clear the floats in #wrapper is the extra closing </div> needed? Try

#wrapper {
margin: 10px;
overflow: auto;
}

xelawho
02-22-2011, 09:25 PM
:thumbsup:

thanks, Excavator. Clearing the float worked :D

for the other one, the validator doesn't seem to mind if I leave it at '<div id="detailmap">' without closing the div so I am happy there.

There's some stuff about aligning the text to the logo that I've googled and only vaguely understand, but the other one that has really got me is the table nested inside the div at line #790:


<div class="control"> <div id="results">
<table id="featuretable">
<tbody id="featuretbody">
</tbody>
</table>
</div>
</div>

validator says that I am closing the table before it has finished (and then notes that it may be nested badly) but neither of these are the case, afaik...

xelawho
02-22-2011, 10:19 PM
ok, got that one sussed, too... apparently the table needed child elements before the validator would give me the :thumbsup:

... so I added a couple of empty ones like this:
<tr><th></th></tr>

which made absolutely no difference to the working of the page, but it appears that everyone's happy...

xelawho
02-22-2011, 11:07 PM
well, sorry to be posting basically the same question, but I'm doing a little tidy up on all my pages now, and I'm having a very similar problem here (http://www.xelawho.com/map/drive.htm)

I tried clearing the floats in the wrapper, but that seems to do nothing. The validator is complaining about the closing tags in these lines:


way+='<div class="dir">'+count+'. '+dir+'</div>'+'<div class="results"><div class="time">'+time+'</div><div class="dist">'+dist+'</div></div>'+end+'<br>';

and


else way+='<div class="dir">'+count+'. '+dir+'</div>'+end;

I'm trying to look at this in firebug, but I can see the html, the css, the script OK, but I can't see where it would be telling me what's the problem here - is there something I'm missing?

Excavator
02-23-2011, 01:18 AM
Clearing the float worked

Right on! Glad you got it working, sorry I was being so dense I missed the issue the first two times I looked at it :rolleyes:

xelawho
02-23-2011, 01:24 AM
hey, that's no problem - I missed it the first two thousand times I looked at it, so you're off the hook.

but I'd love to know what's going on with this other thing, or, being that it's part of the script, is it more of a javascript question?

Excavator
02-23-2011, 01:31 AM
what's going on with this other thing, or, being that it's part of the script, is it more of a javascript question?

I was thinking some js guy would come along and figure it out. I have no idea...

Maybe a new thread in the .js forum would get you an answer faster.

xelawho
02-23-2011, 02:37 AM
... turns out I needed to escape them, like this:
<\/div>

altho' there's probably a fancier way to do it... :o



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum