i'm new to css and html,
would like to separete between the css and html part in order to write better code.
Writing a list component with a favorite/unfavorite option. this is the body in my index.html
would like to move style="visibility:hidden" to the css file styles.css under same project. how can i acess this specific tag from styles.css ?
thank you!
<body>
<ul class="leftSidebarList mdl-list">
<li class="mdl-list__item mdl-list__item--three-line">
<span class="mdl-list__item-secondary-content">
<a class="likeUnlike" href="#">
<i class="nonFavBtn" onclick="favOnclick(this)" class="material-icons">favorite_border</i>
<i class="favBtn" onclick="favOnclick(this)" style="visibility:hidden" class="material-icons">favorite</i>
</a>
</span>
</li>
</ul>
There are two options that you can do to move style to css file. as you have two tags with same class 1) you can add extra class to this tag and add css style like .mdl-list__item-secondary-content .fav{visibility:hidden;} 2) you can use css selectors .mdl-list__item-secondary-content .likeUnlike i+i {visibility:hidden;} if the css doesn't work you can use visibility:hidden !important; reference https://www.w3schools.com/cssref/sel_element_pluss.asp