HTML White Space from Hidden Controls

  • Thread starter Thread starter Don Miller
  • Start date Start date
D

Don Miller

When an ASP.NET 2.0 web page is rendered with multiple web controls hidden
from view (.visible=false) there is a noticeable gap between a rendered
element (like a table) and the next visible element (e.g. a button). When I
look at the HTML source code there is nothing there except white space (see
below).

First of all, I thought browsers ignore white space and condense it down to
one space, but most of all, how can controls be hidden from the rendered
view so that the controls don't leave gaps between elements (like the
controls are there but they are not)?

Thanks for any tips.

</tr></table>








<input type="submit" name="btnStartOver" value="Start Over"
id="btnStartOver" />
 
tables are a block element with a margin and a border, no whitespace.
set these to 0px and the table will not add any space.

-- bruce (sqlwork.com)
 
Hi,

Don said:
When an ASP.NET 2.0 web page is rendered with multiple web controls hidden
from view (.visible=false) there is a noticeable gap between a rendered
element (like a table) and the next visible element (e.g. a button). When I
look at the HTML source code there is nothing there except white space (see
below).

First of all, I thought browsers ignore white space and condense it down to
one space, but most of all, how can controls be hidden from the rendered
view so that the controls don't leave gaps between elements (like the
controls are there but they are not)?

Thanks for any tips.

</tr></table>








<input type="submit" name="btnStartOver" value="Start Over"
id="btnStartOver" />

Many browsers render new lines in the HTML codes as whitespaces in the
rendered view. The reason is that in a block of text, when you have a
new line in the text, the browser wants to separate the words.
Unfortunately, it also often creates unwanted white spaces when you want
your HTML code to be nicely formatted.

To avoid this, the only certain way is to write
</tr></table><input type="submit"
name="btnStartOver"
value="Start Over"
id="btnStartOver" />

HTH,
Laurent
 
Thanks, I didn't know (or expect) that. I guess that also means that I can't
include new lines in my ASP.NET code (for coding formatting) but should make
sure all tags are end-to-end.

Laurent Bugnion said:
Hi,

Don said:
When an ASP.NET 2.0 web page is rendered with multiple web controls
hidden from view (.visible=false) there is a noticeable gap between a
rendered element (like a table) and the next visible element (e.g. a
button). When I look at the HTML source code there is nothing there
except white space (see below).

First of all, I thought browsers ignore white space and condense it down
to one space, but most of all, how can controls be hidden from the
rendered view so that the controls don't leave gaps between elements
(like the controls are there but they are not)?

Thanks for any tips.

</tr></table>








<input type="submit" name="btnStartOver" value="Start Over"
id="btnStartOver" />

Many browsers render new lines in the HTML codes as whitespaces in the
rendered view. The reason is that in a block of text, when you have a new
line in the text, the browser wants to separate the words. Unfortunately,
it also often creates unwanted white spaces when you want your HTML code
to be nicely formatted.

To avoid this, the only certain way is to write
</tr></table><input type="submit"
name="btnStartOver"
value="Start Over"
id="btnStartOver" />

HTH,
Laurent
--
Laurent Bugnion [MVP ASP.NET]
Software engineering, Blog: http://www.galasoft-LB.ch
PhotoAlbum: http://www.galasoft-LB.ch/pictures
Support children in Calcutta: http://www.calcutta-espoir.ch
 
H5,

Don said:
Thanks, I didn't know (or expect) that. I guess that also means that I can't
include new lines in my ASP.NET code (for coding formatting) but should make
sure all tags are end-to-end.

In most cases, it doesn't matter, because the white spaces are not
visible. It does matter, however, when you have, for example, an image
in a DIV, and the DIV must "hug" the image as tightly as possible

So, generally, you may format your code as you wish, even with
indentation, new lines, etc... but in cases where white spaces suddenly
appear in the rendered view, then it's a good idea to append the tags
without new lines in between (only where necessary).

HTH,
Laurent
 
Back
Top