div question IE/Opera vs. FireFox/Safari who's right?

Discussion in 'HTML' started by Damien Cymbal, Mar 17, 2006.

  1. I've stripped this down from a larger page to make it as simple as
    possible. The relevant bits are supposed to represent a sort of context
    menu down the left hand side of the page. When I render this on IE and
    Opera and then shrink the browser window width, the strings in the menu
    display ok. When I render it in Firefox/Safari/Epiphany/Konqueror the
    strings start to overflow/overlap and just become a jumbled mess as I
    squeeze the window. Is there a cross-platform way to achieve the IE


    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    Bad Content Menu
    <style type="text/css">
    ..menu-container ul
    padding: 1px 1px 1px 1px;
    margin: 0 0 /*1em*/ 0.5em 0;
    list-style-type: none;
    background-color: #666666;
    color: #FFFFFF;
    font: 12px arial;
    text-align: left;
    ..menu li a
    padding: 0 0 0 0.25em;
    text-decoration: none;
    background-color: #9E9EA2;
    color: #FFFFFF;
    border-top: solid 1px #575757;
    border-left: solid 1em #575757;
    ..menu li a:hover
    background-color: #A5C3DE;
    color: #000000;
    border-style: solid;
    border-color: #999999;
    border-width: 1px;
    border-style: solid;
    border-color: #999999;
    border-width: 1px;
    border-left: none;

    <table id="layout" align="center" border="0" cellpadding="0"
    cellspacing="0" width="100%" summary="foo">
    <td id="container-menu-layout">
    <h2>Menu Title</h2>
    <div class="menu-container">
    <ul class="menu">
    <li><a href="#String1">String1</a></li> <li><a
    href="#String2">String2 a bit longer</a></li> <li><a
    href="#String3">String3 which is really really long</a></li>
    <td id="container-layout">
    <div id="container">
    Damien Cymbal, Mar 17, 2006
    1. Advertisements

  2. 1) Your in quirks mode!
    2) you set the height for your links and and make them block elements
    so I'd say Firefox and Safari
    <snip code>
    Jonathan N. Little, Mar 17, 2006
    1. Advertisements

  3. Damien Cymbal

    Jim Moe Guest

    Add this to ".menu li a":
    white-space: nowrap;

    Next time describe what "display ok" means.
    Jim Moe, Mar 17, 2006
    1. Advertisements

Ask a Question

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

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.