Build a Stylized To-Do List - Build a Stylized To-Do list

HTML-CSS
1

Tell us what’s happening:

I’m having trouble with this issue, I’ve tried almost everything, except the right one

  1. The li inside the ul with the class sub-item should have an anchor element with the class sub-item-link.

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">

<head>
    
    <meta charset="utf-8">
    <title>A lista do pai</title>
    
</head>

<body>

<ul class="todo-list">
    <li><input type="checkbox" id="graos"><label for="graos">Grãos</label>
    <ul class="sub-item">
        <li><a  class="sub-item-link" href="https://encrypted-tbn3.gstatic.com/shopping?q=tbn:ANd9GcRsnLm4YGBNejw_V9rTTageSWlIB_w8iR5DFkPS5B2zS2v9nxnibe_o1z4KvZkfTCVUUOgeL3cjnKDg7ngUHK35PttYT_6tpSG0ta_kZPaB8brlt9mEocoHPA" target="_blank">Arroz</a></li>
        <li><a  class="sub-item-link"href="https://encrypted-tbn2.gstatic.com/shopping?q=tbn:ANd9GcR2Zyv89-Yte4G57GaeEG1YJjib2CLBxUBS4woP1EqHomT65MkioXpcd0n52GdNdTccNZaw6jrObuwYAhTB-tI499iSBrRi17KDTPzlTTWC-jR8TosFjsHT" target="_blank">Feijão</a></li>
        <li><a  class="sub-item-link"href="https://encrypted-tbn3.gstatic.com/shopping?q=tbn:ANd9GcQ2wb8bfW4VdbyjqC0fTtzrUBeTK6HLzlWlG8dEh7gB4Efr7gb8wm4uWnrILNUhg0KT1SKkmt4p2XK_n4DnpOCUqTc8C7mzuCgxqp75obajgFAVcKq1xay-" target="_blank">Grão de Bico</a></li>
        <li><a  class="sub-item-link"href="https://encrypted-tbn1.gstatic.com/shopping?q=tbn:ANd9GcQG5lb3QnGQn532KeYQoaLbR1FvnqhmsEutb4vPt_B7W509wnOU6QiDj1eOvNVenn8repX1Bg9CtMvH6CnkGvXtAHohYuLmAcdLR5k_OedY-r1dwv3rDQGXGfQ" target="_blank">Milho</a></li>
    </ul></li>

    <li><input type="checkbox" id="frios"><label for="frios">Frios</label><ul class="sub-item">
                <li><a  class="sub-item-link"href="https://encrypted-tbn0.gstatic.com/shopping?q=tbn:ANd9GcS0gb281ZxvZ3BkYDo141cTttYqGOZfjB_yXh_zJh-V6jYb-MgTjbcm5siaKJQMFNkrY5m6JW1K-HazZLySePemOLg5xc2qVRJprT8iJadgNJGb5quS076RVA" target="_blank">Filé de Frango</a></li>
        </ul>
    </li>

    <li><input type="checkbox" id="bolachas"><label for="bolachas">Bolachas</label><ul class="sub-item">
        <li><a  class="sub-item-link"href="https://encrypted-tbn2.gstatic.com/shopping?q=tbn:ANd9GcQvlznlpbRPncNWT_6IlLh4UsDSMGzKhntwzDNrIjWtwYE9Y-d8s8yFRlwNbYIsCVL7YC_lTQ9B5D5p5q39M6-jYnUJHa7gZf0Mc41YgnUNfZhRBwyE8i_V" target="_blank">Rosquinha Mabel</a></li>
        </ul>
    </li>


    <li><input type="checkbox" id="feira"><label for="feira">Verduras e Legumes</label><ul class="sub-item">
        <li><a  class="sub-item-link" href="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" target="_blank">Banana Maça</a></li>
        </ul>
    </ul>
</body>

</html>

/* file: styles.css */
.sub-item-link:hover{
  color:green;
}
.sub-item-link:active{

}
.sub-item-lin k:link{
  color:pink;
}
.sub-item-link:visited{

}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/140.0.0.0 Safari/537.36

Challenge Information:

Build a Stylized To-Do List - Build a Stylized To-Do list

2

We’ve all been there, lol

I would add a space after the " following the class values.

1 Like
3

this don’t worked bro,but I appreciate that,I don’t why this not working lmao

4

are you sure you are following the user stories correctly? the tests are finding an unexpected number of .sub-item-link

1 Like
5

whyyy??? this don’t have sense,why can I don’t in every

  • ? it’s wrong if I do?, it’s only be the freecodecamp need? and thanks so much,and i’m sorry for my English,i’m Brasilian and i training my English too…if wanna be my friend,just call me,was be awesom!!

    • 6

    please make sure you are following user story 3 exactly