How to remove gaps between FRAMEs without compromising HTML validity?
I know frames are bad. However, I have to stick with them for a little longer. My problem is with the non-standard "border" attribute of the "frameset" element:
<frameset border="0">
...
</frameset>
If I don't use this attribute, browsers put a gap between each frame. If I use an attribute, the HTML validators throw an "unsupported attribute" error.
Now I hear you say "use it and ignore the validator", that's fine. I think I can live with one validator warning and browsers don't seem to bother too much about that either :)
My question is mostly about HTML tricks. How do I set the border to 0 and still be browser compatible? Think of it as an exercise for similar problems in the future. For example, I tried:
<frameset onload="this.border='0'">
and it didn't work.
I tried to use stylesheets in inner frames to set "border: 0; margin: 0; padding: 0", that didn't work either. The Gap seems to come from an unknown source.
I was thinking of writing in Javascript, for example:
document.write('<frameset border="0">');
But I have a hunch that it won't check anyway.
Can you imagine an alternative solution?
Other solutions that didn't work:
- @Donut: "frameborder" attribute for "frame" or "frameset" elements
- @kangax: frameSetObj.setAttribute ('border', 0);
source to share
According to my tests, they should work:
For Opera (10):
frameSetObj.setAttribute("framespacing", "0");
For IE8:
frameSetObj.setAttribute("framespacing", "0");
//set rows and cols attributes again if the frameset already had them.
frameSetObj.setAttribute("rows", rows);
frameSetObj.setAttribute("cols", cols);
For FireFox 3.5 and Chrome 3
frameSetObj.setAttribute("frameborder", "0");
//same idea as IE8
frameSetObj.setAttribute("rows", rows);
frameSetObj.setAttribute("cols", cols);
To summarize, this code should work in every browser:
frameSetObj.setAttribute("framespacing", "0");
frameSetObj.setAttribute("frameborder", "0");
frameSetObj.setAttribute("rows", rows);
frameSetObj.setAttribute("cols", cols);
source to share
Use the attribute frameborder
in tags instead of on . As per the HTML spec, there is no attribute (or ) defined for tags . In fact, all W3C pages on frames are worth checking out. the example found there might be helpful for your reference. You will also want to make sure you are using the correct one . In the example: frame
border
frameset
border
frameborder
frameset
DOCTYPE
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
source to share