CODEWITHSUNDEEP
htmlcss
Dacobah
Dacobah

Reputation: 789

How to hide only a part of the content of a li with CSS?

In the following code I would like to hide "Hello world" but keep visible my ul.myphotos with CSS.

Here is a sample of what I have:

<ul class="content">
    <li>
        Hello world
        <ul class="myphotos">
            <li>Photo1</li>
            <li>Photo2</li>
        </ul>
    </li>
</ul>

Upvotes: 1

Views: 104

Answers (2)

Christoph
Christoph

Reputation: 51211

You cant do that with the code you have atm (well, yes you can with some rather "hacky" tricks...).

I'd propose a clean solution: Wrap that text in a separate tag, e.g.:

<ul class="content">
    <li>
        <span>Hello world</span>
        <ul class="myphotos">
            <li>Photo1</li>
            <li>Photo2</li>
        </ul>
    </li>
</ul>

And now you can easily say:

li > span{
   display:none;
}

Upvotes: 2

Conner
Conner

Reputation: 31070

Put Hello World in <span> tags with an id and then hide that.

Upvotes: 1

Related Questions