Search code examples
csshtml-listsinline-styles

Trying to 'undo' several CSS options with an inline statement


I'm trying to 'undo' the style in an unnumbered list by putting an inline style statement in the 'li' tags. I have everything looking the way I want except that I'm missing the bullet.

Below is the original CSS and my inline style options to overwrite them:

#account_header li {
    border-bottom: 1px solid #888888;
    border-top: 1px solid #888888;
    display: inline;
    list-style-type: none;
    margin: 0;
    overflow: hidden;
    padding: 0 10px 0 0;
    color: #AA2222;
    font-family: "arial","helvetica";
    font-size: 16px;
    font-weight: bolder;
}

Here's what I have inside my 'li' tag:

<li style="border: none;display: block;margin: 0;overflow: hidden;padding: 0;list-style:disc outside none;">

Thanks in advance...I've wasted plenty of time on this already!


Solution

  • I don't think anyone's going to believe this one, but it turned out to be the overflow-x and overflow-y options. They were set to 'hidden,' and I had to look in the "computed" tab in Firebug to see it (I'm kind of a CSS newbie, so I've never heard of these before). Basically, I took Mr Lister's suggestion to do an extremely simple list, copied the computed styles into text files and used UltraStudio's compare feature to see the difference.

    I wish there was an easier way to set things back to default!

    Here's what I have at the moment:

    <li style="border: none;display: list-item;margin: 0;padding: 0;visibility: visible;overflow-y: visible;overflow-x: visible;list-style:disc outside none;" >
    

    Thanks for your help, everyone!