sizeable grid

[Jesse Aufiero]

I was wondering if anyone knows how to get a datagrid to size as the browser
is resized such that the datagrid's borders would appear anchored to the
browser edges. The datagrid should have a white-space border around it and
scrollbars should automatically appear on the datagrid should the contents
of the grid spill outside of the viewable area.

I have gotten this to work for the IE browser by placing a DIV tag around
the datatable (shown below). And to maintain a margin of white space around
each edge of the grid as the browser is resized, I placed the DIV section
inside of a table, with rows and columns that maintain the white-space
margin around the grid, and whose center cell is set to a height and width
of 100%.

a snippet...

<TD align="right" width="100%" height="100%">

<DIV style="OVERFLOW : auto; WIDTH: 100%; HEIGHT: 100%">

{Datatable}

</DIV>

</TD>

....but this code does not work in a Mozilla/Firefox browser. Instead, the
datagrid extends well beyond the browser's right and bottom edges, causing
unwanted browser scrollbars to appear.

I know there must be a way around this, perhaps by using style sheets. But
I'm not sure what next steps to take.

[S. Justin Gengo]

Jesse,

Set the grids contents to allow wrapping and then set the grid's width to a
percentage.

--
Sincerely,

S. Justin Gengo, MCP
Web Developer / Programmer

www.aboutfortunate.com

"Out of chaos comes order."
Nietzsche
"Jesse Aufiero" <ja******@moabo il.com> wrote in message
news:ef******** ******@tk2msftn gp13.phx.gbl...

I was wondering if anyone knows how to get a datagrid to size as the
browser is resized such that the datagrid's borders would appear anchored
to the browser edges. The datagrid should have a white-space border around
it and scrollbars should automatically appear on the datagrid should the
contents of the grid spill outside of the viewable area.

I have gotten this to work for the IE browser by placing a DIV tag around
the datatable (shown below). And to maintain a margin of white space
around each edge of the grid as the browser is resized, I placed the DIV
section inside of a table, with rows and columns that maintain the
white-space margin around the grid, and whose center cell is set to a
height and width of 100%.

a snippet...

<TD align="right" width="100%" height="100%">

<DIV style="OVERFLOW : auto; WIDTH: 100%; HEIGHT: 100%">

{Datatable}

</DIV>

</TD>

...but this code does not work in a Mozilla/Firefox browser. Instead, the
datagrid extends well beyond the browser's right and bottom edges, causing
unwanted browser scrollbars to appear.

I know there must be a way around this, perhaps by using style sheets.
But I'm not sure what next steps to take.

[Jesse Aufiero]

Unfortunately one of my requirements, for reasons of legibility, is to leave
the grids contents unwrapped. Hence the need for scrollbars when the
contents of the grid inevitably extend beyond the viewable area.
"S. Justin Gengo" <justin@[no_spam_please]aboutfortunate. com> wrote in
message news:%2******** *******@TK2MSFT NGP10.phx.gbl.. .

Jesse,

Set the grids contents to allow wrapping and then set the grid's width to
a percentage.

--
Sincerely,

S. Justin Gengo, MCP
Web Developer / Programmer

www.aboutfortunate.com

"Out of chaos comes order."
Nietzsche
"Jesse Aufiero" <ja******@moabo il.com> wrote in message
news:ef******** ******@tk2msftn gp13.phx.gbl...

I was wondering if anyone knows how to get a datagrid to size as the
browser is resized such that the datagrid's borders would appear anchored
to the browser edges. The datagrid should have a white-space border
around it and scrollbars should automatically appear on the datagrid
should the contents of the grid spill outside of the viewable area.

I have gotten this to work for the IE browser by placing a DIV tag around
the datatable (shown below). And to maintain a margin of white space
around each edge of the grid as the browser is resized, I placed the DIV
section inside of a table, with rows and columns that maintain the
white-space margin around the grid, and whose center cell is set to a
height and width of 100%.

a snippet...

<TD align="right" width="100%" height="100%">

<DIV style="OVERFLOW : auto; WIDTH: 100%; HEIGHT: 100%">

{Datatable}

</DIV>

</TD>

...but this code does not work in a Mozilla/Firefox browser. Instead,
the datagrid extends well beyond the browser's right and bottom edges,
causing unwanted browser scrollbars to appear.

I know there must be a way around this, perhaps by using style sheets.
But I'm not sure what next steps to take.

[Bruce Barker]

this is a bug in IE, might be fixed in the next release.

while the browser tries to make the body width equal the frame width, it
makes no attempt on the height. thus on the <div style="height=1 00%;">, it
is setting the div's height to the parents height. in this case the parent
is the body, whose height is auto (size of content), this make the div's
height auto also, so no scrollbars are needed. you to need to set the height
of the div parents, so that it can calc a size smaller than the frame.

add this line:

<style type="text/css">html, body{height:100 %}</style>
-- bruce (sqlwork.com)

"Jesse Aufiero" <ja******@moabo il.com> wrote in message
news:ef******** ******@tk2msftn gp13.phx.gbl...

I was wondering if anyone knows how to get a datagrid to size as the
browser is resized such that the datagrid's borders would appear anchored
to the browser edges. The datagrid should have a white-space border around
it and scrollbars should automatically appear on the datagrid should the
contents of the grid spill outside of the viewable area.

I have gotten this to work for the IE browser by placing a DIV tag around
the datatable (shown below). And to maintain a margin of white space
around each edge of the grid as the browser is resized, I placed the DIV
section inside of a table, with rows and columns that maintain the
white-space margin around the grid, and whose center cell is set to a
height and width of 100%.

a snippet...

<TD align="right" width="100%" height="100%">

<DIV style="OVERFLOW : auto; WIDTH: 100%; HEIGHT: 100%">

{Datatable}

</DIV>

</TD>

...but this code does not work in a Mozilla/Firefox browser. Instead, the
datagrid extends well beyond the browser's right and bottom edges, causing
unwanted browser scrollbars to appear.

I know there must be a way around this, perhaps by using style sheets.
But I'm not sure what next steps to take.

[Jesse Aufiero]

IE renders it fine... it's Mozilla/Firefox that I'm having trouble with.
"Bruce Barker" <br************ ******@safeco.c om> wrote in message
news:OK******** *****@tk2msftng p13.phx.gbl...

this is a bug in IE, might be fixed in the next release.

while the browser tries to make the body width equal the frame width, it
makes no attempt on the height. thus on the <div style="height=1 00%;">, it
is setting the div's height to the parents height. in this case the parent
is the body, whose height is auto (size of content), this make the div's
height auto also, so no scrollbars are needed. you to need to set the
height of the div parents, so that it can calc a size smaller than the
frame.

add this line:

<style type="text/css">html, body{height:100 %}</style>
-- bruce (sqlwork.com)

"Jesse Aufiero" <ja******@moabo il.com> wrote in message
news:ef******** ******@tk2msftn gp13.phx.gbl...

I was wondering if anyone knows how to get a datagrid to size as the
browser is resized such that the datagrid's borders would appear anchored
to the browser edges. The datagrid should have a white-space border
around it and scrollbars should automatically appear on the datagrid
should the contents of the grid spill outside of the viewable area.

I have gotten this to work for the IE browser by placing a DIV tag around
the datatable (shown below). And to maintain a margin of white space
around each edge of the grid as the browser is resized, I placed the DIV
section inside of a table, with rows and columns that maintain the
white-space margin around the grid, and whose center cell is set to a
height and width of 100%.

a snippet...

<TD align="right" width="100%" height="100%">

<DIV style="OVERFLOW : auto; WIDTH: 100%; HEIGHT: 100%">

{Datatable}

</DIV>

</TD>

...but this code does not work in a Mozilla/Firefox browser. Instead,
the datagrid extends well beyond the browser's right and bottom edges,
causing unwanted browser scrollbars to appear.

I know there must be a way around this, perhaps by using style sheets.
But I'm not sure what next steps to take.

[Juan T. Llibre]

You might want to take a look at this free article
"Rendering to Firefox from ASP.NET" :
http://asptoday.com/Content.aspx?id=2339

Also, make sre your web.config has the updated Mozilla/Firefox entries :
http://slingfive.com/pages/code/browserCaps/

the actual text which needs to be included in web.config is at :
http://slingfive.com/pages/code/brow...aps_spaces.txt

Juan T. Llibre, ASP.NET MVP
ASP.NET FAQ : http://asp.net.do/faq/
Foros de ASP.NET en Español : http://asp.net.do/foros/
=============== =============== ========
"Jesse Aufiero" <ja******@moabo il.com> wrote in message
news:eA******** *****@TK2MSFTNG P12.phx.gbl...

IE renders it fine... it's Mozilla/Firefox that I'm having trouble with.
"Bruce Barker" <br************ ******@safeco.c om> wrote in message
news:OK******** *****@tk2msftng p13.phx.gbl...

this is a bug in IE, might be fixed in the next release.

while the browser tries to make the body width equal the frame width, it makes no
attempt on the height. thus on the <div style="height=1 00%;">, it is setting the div's
height to the parents height. in this case the parent is the body, whose height is auto
(size of content), this make the div's height auto also, so no scrollbars are needed.
you to need to set the height of the div parents, so that it can calc a size smaller
than the frame.

add this line:

<style type="text/css">html, body{height:100 %}</style>
-- bruce (sqlwork.com)

"Jesse Aufiero" <ja******@moabo il.com> wrote in message
news:ef******** ******@tk2msftn gp13.phx.gbl...

I was wondering if anyone knows how to get a datagrid to size as the browser is resized
such that the datagrid's borders would appear anchored to the browser edges. The
datagrid should have a white-space border around it and scrollbars should automatically
appear on the datagrid should the contents of the grid spill outside of the viewable
area.

I have gotten this to work for the IE browser by placing a DIV tag around the
datatable (shown below). And to maintain a margin of white space around each edge of
the grid as the browser is resized, I placed the DIV section inside of a table, with
rows and columns that maintain the white-space margin around the grid, and whose
center cell is set to a height and width of 100%.

a snippet...

<TD align="right" width="100%" height="100%">

<DIV style="OVERFLOW : auto; WIDTH: 100%; HEIGHT: 100%">

{Datatable}

</DIV>

</TD>

...but this code does not work in a Mozilla/Firefox browser. Instead, the datagrid
extends well beyond the browser's right and bottom edges, causing unwanted browser
scrollbars to appear.

I know there must be a way around this, perhaps by using style sheets. But I'm not
sure what next steps to take.

[Jesse Aufiero]

Thanks for the comprehensive answer. Had I asked you a few days ago I could
have saved myself hours of google searches. But actually, I have already
seen all three of these pages and, after applying what I learned from them,
I'm still having issues. I'm not quite sure what to do next here. But
thank you for the info.

Probably what I need is someone who has gone through this exact problem
before, but finding that person will be hard.
"Juan T. Llibre" <no***********@ nowhere.com> wrote in message
news:uB******** ******@TK2MSFTN GP09.phx.gbl...

You might want to take a look at this free article
"Rendering to Firefox from ASP.NET" :
http://asptoday.com/Content.aspx?id=2339

Also, make sre your web.config has the updated Mozilla/Firefox entries :
http://slingfive.com/pages/code/browserCaps/

the actual text which needs to be included in web.config is at :
http://slingfive.com/pages/code/brow...aps_spaces.txt

Juan T. Llibre, ASP.NET MVP
ASP.NET FAQ : http://asp.net.do/faq/
Foros de ASP.NET en Español : http://asp.net.do/foros/
=============== =============== ========
"Jesse Aufiero" <ja******@moabo il.com> wrote in message
news:eA******** *****@TK2MSFTNG P12.phx.gbl...

IE renders it fine... it's Mozilla/Firefox that I'm having trouble with.

"Bruce Barker" <br************ ******@safeco.c om> wrote in message
news:OK******** *****@tk2msftng p13.phx.gbl...

this is a bug in IE, might be fixed in the next release.

while the browser tries to make the body width equal the frame width, it
makes no attempt on the height. thus on the <div style="height=1 00%;">,
it is setting the div's height to the parents height. in this case the
parent is the body, whose height is auto (size of content), this make
the div's height auto also, so no scrollbars are needed. you to need to
set the height of the div parents, so that it can calc a size smaller
than the frame.

add this line:

<style type="text/css">html, body{height:100 %}</style>
-- bruce (sqlwork.com)

"Jesse Aufiero" <ja******@moabo il.com> wrote in message
news:ef******** ******@tk2msftn gp13.phx.gbl...
I was wondering if anyone knows how to get a datagrid to size as the
browser is resized such that the datagrid's borders would appear
anchored to the browser edges. The datagrid should have a white-space
border around it and scrollbars should automatically appear on the
datagrid should the contents of the grid spill outside of the viewable
area.

I have gotten this to work for the IE browser by placing a DIV tag
around the datatable (shown below). And to maintain a margin of white
space around each edge of the grid as the browser is resized, I placed
the DIV section inside of a table, with rows and columns that maintain
the white-space margin around the grid, and whose center cell is set to
a height and width of 100%.

a snippet...

<TD align="right" width="100%" height="100%">

<DIV style="OVERFLOW : auto; WIDTH: 100%; HEIGHT: 100%">

{Datatable}

</DIV>

</TD>

...but this code does not work in a Mozilla/Firefox browser. Instead,
the datagrid extends well beyond the browser's right and bottom edges,
causing unwanted browser scrollbars to appear.

I know there must be a way around this, perhaps by using style sheets.
But I'm not sure what next steps to take.