Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Help hiding a li

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #299029
    wisconsinCSS
    Participant

    Hello all. I’m hoping someone can help me with a css issue. I need to adjust a feed using only css – no scripting is possible.
    The issue is that the

    <

    ul> has text that’s not inside an

  • tag. I’ve created an example below. The result should just be:

    Tea| Milk| Coffee|

    I’ve been setting everything in .test{ visibility:hidden} then showing the items .test li {visibility: visible;} and then hiding the first .test li:first-child {
    display: none;
    }
    BUT, this still has the non-li text taking up space and that throws everything off.

    I appreciate any help anyone has to offer and sorry that I don’t know how to format this correctly. I do CSS about twice a year for the last 20 years and don’t do it enough to ever get good at it.

    .test li {display:inline;padding:20px}
    .test ul {
    display: inline-block;
    list-style-type: disc;
    margin-top: 1em;
    margin-bottom: 1 em;
    margin-left: 0;
    margin-right: 0;
    padding-left: 40px;
    }

      Hide this and take up 0 width|

    • Hide this as well and take up 0 width|
    • Tea|
    • Milk|
    • Coffee|
#299169
JeroenR
Participant

Can you try building a demo on what your work looks like in https://codepen.io for example?

display: none; should do the trick for you as it takes no space at all.

You can also wonder if the item you desperately want to hide should be in the HTML in the first place.

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘CSS’ is closed to new topics and replies.