#1
  1. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2000
    Posts
    1
    Rep Power
    0
    Is there any way to control table or column width with external style sheets that works in both 4.0 browsers?

    Anybody?
  2. #2
  3. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 1999
    Location
    foo (ca)
    Posts
    11
    Rep Power
    0
    I haven't found one. Sorry dude. Check irt.org (ask if they don't have anything)

    ------------------
    =-=-=-
    biolight@yahoo.com
    http://theDogPile.com
  4. #3
  5. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2000
    Posts
    1
    Rep Power
    0
    Obviously, one can use different .js files depending on which page one is on. And, one can change pages using redirects, which can happen based on conditions. I use this so that I can have different .js files depending on whether the reader is using Navigator or IE. This may not be as elegant as you'd hoped for, but it works. You can read an example of how this method can be implemented from my page http://davidl1621.freeservers.com/rose.html
    (This was homework for a class, so some of the content is a little cheezy, but the code works... I've tested it using various versions of IE5.xxxxxxxxx and Navigator 4.x.)
    Dave LaPointe
    P.S. You could probably also do this by generating HTML/javascript on server side using ASP/CGI/JSP, etc. So, although it isn't necessarily straightforward, there are numerous workarounds. Which workaround is appropriate depends on the details of what you are trying to do, of course.
  6. #4
  7. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2000
    Posts
    36
    Rep Power
    15
    I have something that works for NS4.7 and IE5 and IE5.5. It may work elsewhere, but I haven't tested it. My version uses no tables whatsoever and has a left column (L) of constant width. The right "column" is actually a box (R) so that below the box, the center text (C) flows around it and all sits below a header (H). So it's like this (if my ASCII art works):

    HHHHHHHH
    LLCCCCRR
    LLCCCCRR
    LLCCCCCC
    LLCCCCCC

    Some notes:

    It's a real hassle to get all of this to work, and I just wanted to see if I could. Some examples:
    1. NS4 does background color poorly, so I use a 1-pixel image to provide a background color that fills the entire box, instead of just following the text.

    2. IE5.5 has a bug in the way it does margins, so you have to pad the box rather than use a margin.

    3. The trick is to mix absolutely and relatively boxes. For example, the left column could have a width of 12em and be positioned absolutely in the top left. Then The center column has a padding of 12em to provide space for the left column + 3em for a margin (thus padded 15em).


    I hope this doesn't turn out to be disastrous, but I will try to include the style sheet here using Devshed code tags. If it doesn't work, email me at tomZZZZ@lambert.net (remove the ZZZZ which is only to confuse spam page scrapers). Also, check out the excellent tutorials at http://webreference.com/html/ Look up tutorials 19 and 21 which cover this pretty fully.

    Tom

    <BLOCKQUOTE><font size="1" face="Verdana,Arial,Helvetica">code:</font><HR><pre>
    /* suggest styles for text elements */

    /* Multi selection necessary because inheritance doesn't work well in */
    /* tables in any browser, and works poorly in Nav4x in all situations */

    body, table, th, td, p {font-family: trebuchet, helvetica, times, sans-serif;}

    /* special for h3 for use with leftnav class because inheritance so bad in Nav4x */
    h3 {
    font-size: 12pt;
    text-align: center;
    }

    /* link styles */
    a:link.navlink, a:visited.navlink {color: blue; text-decoration: none;}
    a:hover.navlink {color: blue; text-decoration: underline;}

    dt {
    font-size: 12pt;
    font-weight: bold;
    }
    dd {
    font-size: 10pt;
    text-indent: -4em;
    }

    p.longtext {
    text-indent: 3em;
    line-height: 1.4;
    }

    /************************************************************/
    /* Page layout style. */
    /* See comments regarding buggy browser work-arounds. */
    /************************************************************/

    .main {
    position: relative;
    padding-right: 5em;
    }
    .content {
    padding-left: 15.5em; /* margin is buggy in IE5.5 */
    font-size: 12pt;
    }
    .leftnav {
    position: absolute;
    left: 0;
    width: 14em;
    padding: 1em;
    background-image: url(tan.gif); /* background-color buggy in Nav4x */
    background-repeat: repeat;
    font-size: 10pt;
    }

    .rightbox{
    float : right;
    width : 25%;
    padding: 1em;
    background-image: url(tan.gif); /* background-color buggy in Nav4x */
    background-repeat: repeat;
    font-size: 10pt;
    }
    .header {
    text-align: center;
    }

    .footer {
    padding-top: 2em;
    text-align: center;
    font-size: 10pt;
    }[/code]

Similar Threads

  1. css column height problems
    By andreas_boehmer in forum CSS Help
    Replies: 0
    Last Post: February 12th, 2004, 06:25 PM
  2. Table variable column widths
    By coredumped in forum HTML Programming
    Replies: 2
    Last Post: February 2nd, 2004, 11:31 PM
  3. MyAdmin Column Widths
    By netroact in forum MySQL Help
    Replies: 0
    Last Post: January 31st, 2004, 07:52 PM
  4. CSS - Set widths and realtive widths
    By please_explain in forum CSS Help
    Replies: 4
    Last Post: December 22nd, 2003, 02:47 AM
  5. Simplest 3 column css layout possible?
    By quadrant6 in forum CSS Help
    Replies: 1
    Last Post: January 2nd, 2003, 05:10 PM

IMN logo majestic logo threadwatch logo seochat tools logo