Can max-width be made to work for tables.

Discussion in 'ASP .Net' started by AAaron123, Sep 30, 2009.

  1. AAaron123

    AAaron123 Guest

    Just for testing I have the following.

    <form id="FormMaster" runat="server" style="border: pink 9px Ridge;
    max-width: 770px;

    <table id="TableMain" style="border: Maroon 9px Ridge; max-width: 750px;
    width: 750px">

    On the table max-width does not appear to work.

    The marron border is much wider that the pink one.



    Can max-width be made to work for tables.



    Thanks
    AAaron123, Sep 30, 2009
    #1
    1. Advertising

  2. "AAaron123" <> wrote in
    news:#:

    > Just for testing I have the following.
    >
    > <form id="FormMaster" runat="server" style="border: pink 9px Ridge;
    > max-width: 770px;
    >
    > <table id="TableMain" style="border: Maroon 9px Ridge; max-width:
    > 750px; width: 750px">
    >
    > On the table max-width does not appear to work.
    >
    > The marron border is much wider that the pink one.
    >
    >
    >
    > Can max-width be made to work for tables.


    I am not sure what you are attempting to do here, as the code you have
    here shows me nothing.

    In the first table, you state width = whatever is necessary for the crap
    I shoved in the table, but no more than 770 pixels. This means, if it is
    an empty table, the table is very small.

    In the second table, you state width = 750 pixels and the max width is
    750 pixels, so it will be 750 pixels wide no matter what you do.

    The way to test the difference in max pixels is to fill the table with a
    garbage string of text or something else that will make it expand. For
    example, set two images side by side that equal the larger max width
    (770px, but minus the border on each side, cell padding, etc.). Then
    stick the images in two tables. The larger should end up with the images
    side by side, as it can expand to 770 pixels and the smaller should
    stack them.

    The problem, however, is 2 pixels does not leave you much room for error
    in you calculations. Forget to add one cell padding value or cell
    spacing value and both will wrap, leading you to believe, as you do with
    your "this one has width, this one does not" experiment, that the code
    is not working.

    Peace and Grace,


    --
    Gregory A. Beamer
    MVP; MCP: +I, SE, SD, DBA

    Twitter: @gbworld
    Blog: http://gregorybeamer.spaces.live.com

    *******************************************
    | Think outside the box! |
    *******************************************
    Gregory A. Beamer, Sep 30, 2009
    #2
    1. Advertising

  3. AAaron123

    AAaron123 Guest

    Gregory A. Beamer wrote:
    > "AAaron123" <> wrote in
    > news:#:
    >
    >> Just for testing I have the following.
    >>
    >> <form id="FormMaster" runat="server" style="border: pink 9px Ridge;
    >> max-width: 770px;
    >>
    >> <table id="TableMain" style="border: Maroon 9px Ridge; max-width:
    >> 750px; width: 750px">
    >>
    >> On the table max-width does not appear to work.
    >>
    >> The marron border is much wider that the pink one.
    >>
    >>
    >>
    >> Can max-width be made to work for tables.

    >
    > I am not sure what you are attempting to do here, as the code you have
    > here shows me nothing.
    >
    > In the first table, you state width = whatever is necessary for the
    > crap I shoved in the table, but no more than 770 pixels. This means,
    > if it is an empty table, the table is very small.
    >
    > In the second table, you state width = 750 pixels and the max width is
    > 750 pixels, so it will be 750 pixels wide no matter what you do.
    >
    > The way to test the difference in max pixels is to fill the table
    > with a garbage string of text or something else that will make it
    > expand. For example, set two images side by side that equal the
    > larger max width (770px, but minus the border on each side, cell
    > padding, etc.). Then stick the images in two tables. The larger
    > should end up with the images side by side, as it can expand to 770
    > pixels and the smaller should stack them.
    >
    > The problem, however, is 2 pixels does not leave you much room for
    > error in you calculations. Forget to add one cell padding value or
    > cell spacing value and both will wrap, leading you to believe, as you
    > do with your "this one has width, this one does not" experiment, that
    > the code is not working.
    >
    > Peace and Grace,
    >
    >
    >
    > *******************************************
    >> Think outside the box! |

    > *******************************************


    I'm sorry, I should have said that what I presented is above all my markup
    that fills the tables.

    The markup is quite long.

    And the table width does not appear to be constrained at all in the dispay.

    It expanded to fit the data inside.

    Above the two I showed is:
    <body id="BodyMaster" runat="server" style="border: green 9px Ridge;
    max-width: 800px;

    This also dispalys as expeced - a little wider than the pink border.

    But the marron border (table's) is wider than both.



    What I'm, seeing seems to be at odds with your comment.

    > In the second table, you state width = 750 pixels and the max width is
    > 750 pixels, so it will be 750 pixels wide no matter what you do.


    I have seen a comment on the Internet Tha max-width is supported by most
    browsers.

    Also saw one that said that it is not supported by IE but I checked in FF.

    I also tried adding overflow:hidden to the table's style but that had no
    effect.

    Don't know what to try next.


    Thanks
    AAaron123, Sep 30, 2009
    #3
  4. "AAaron123" <> wrote in
    news::

    > Don't know what to try next.


    Step back to the problem you are trying to solve, not the implementation.
    This is generally what I find the most useful when I am stuck.

    I wish I could give you a more definitive answer, but I don't have a
    working example to view, nor enough code to say "change line 10 and you
    will be fine".

    I am also not sure I completely understand the problem.

    Peace and Grace,


    --
    Gregory A. Beamer
    MVP; MCP: +I, SE, SD, DBA

    Twitter: @gbworld
    Blog: http://gregorybeamer.spaces.live.com

    *******************************************
    | Think outside the box! |
    *******************************************
    Gregory A. Beamer, Sep 30, 2009
    #4
  5. AAaron123

    AAaron123 Guest

    Gregory A. Beamer wrote:
    > "AAaron123" <> wrote in
    > news::
    >
    >> Don't know what to try next.

    >
    > Step back to the problem you are trying to solve, not the
    > implementation. This is generally what I find the most useful when I
    > am stuck.
    >
    > I wish I could give you a more definitive answer, but I don't have a
    > working example to view, nor enough code to say "change line 10 and
    > you will be fine".
    >
    > I am also not sure I completely understand the problem.
    >
    > Peace and Grace,
    >
    >
    >
    > *******************************************
    >> Think outside the box! |

    > *******************************************




    The problem is just that I have max-width defined for body, form and table
    but the table width is wider than its max-width.

    I can pull rows out of the table until I find the culprit.
    Maybe that will tell me something.

    The reason for my post is to see if someons said:
    Oh year, max-width has problems...
    But I understand you believe it works OK.

    Thanks
    AAaron123, Sep 30, 2009
    #5
  6. AAaron123

    bruce barker Guest

    in html, width refers to the elements content width, so it:

    [left-margin][left-border][left-padding][width][right-padding][right-border][right-margin]

    so in your case the total width of your table (assuming padding=0 and
    margin=0) is 750 + 9 + 9 = 768. of course if the the rows are wider than
    this (and don't have a proper overflow specified), they will expand the
    width.

    -- bruce (sqlwork.com)



    AAaron123 wrote:
    > Just for testing I have the following.
    >
    > <form id="FormMaster" runat="server" style="border: pink 9px Ridge;
    > max-width: 770px;
    >
    > <table id="TableMain" style="border: Maroon 9px Ridge; max-width: 750px;
    > width: 750px">
    >
    > On the table max-width does not appear to work.
    >
    > The marron border is much wider that the pink one.
    >
    >
    >
    > Can max-width be made to work for tables.
    >
    >
    >
    > Thanks
    >
    bruce barker, Oct 1, 2009
    #6
  7. AAaron123

    AAaron123 Guest

    bruce barker wrote:
    > in html, width refers to the elements content width, so it:
    >
    > [left-margin][left-border][left-padding][width][right-padding][right-border][right-margin]
    >
    > so in your case the total width of your table (assuming padding=0 and
    > margin=0) is 750 + 9 + 9 = 768. of course if the the rows are wider
    > than this (and don't have a proper overflow specified),



    >they will expand the width.


    even past max-width?

    I found out that the <asp:Menu> element appears to dominate.
    The width will reduce untill it just fits the menu.
    Then the width will not reduce any further.
    If I make the menu narrower the width will reduce more and all the other
    cells shrink OK.
    So I'm using a smaller text for the menu and now things work OK.
    I was going to look at using the Friendly (I think that's what it is called)
    menu but I believe the next framework revision redoes its menu and I didn't
    want to have to learn the Friendly method and then have to start over when
    framework 4 is available.

    Thanks







    >
    > -- bruce (sqlwork.com)
    >
    >
    >
    > AAaron123 wrote:
    >> Just for testing I have the following.
    >>
    >> <form id="FormMaster" runat="server" style="border: pink 9px Ridge;
    >> max-width: 770px;
    >>
    >> <table id="TableMain" style="border: Maroon 9px Ridge; max-width:
    >> 750px; width: 750px">
    >>
    >> On the table max-width does not appear to work.
    >>
    >> The marron border is much wider that the pink one.
    >>
    >>
    >>
    >> Can max-width be made to work for tables.
    >>
    >>
    >>
    >> Thanks
    AAaron123, Oct 1, 2009
    #7
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Paul Furman

    min-width max-width again

    Paul Furman, Feb 9, 2004, in forum: HTML
    Replies:
    10
    Views:
    700
    Beauregard T. Shagnasty
    Feb 9, 2004
  2. Lois
    Replies:
    1
    Views:
    3,189
    Ryan Stewart
    Dec 27, 2004
  3. Summercool
    Replies:
    9
    Views:
    870
    dorayme
    Oct 23, 2007
  4. palun
    Replies:
    15
    Views:
    2,406
    Neredbojias
    Jan 11, 2008
  5. kriton
    Replies:
    0
    Views:
    327
    kriton
    Apr 22, 2005
Loading...

Share This Page