CSS

So I have an unordered list, with list items containing hyperlink tags

<ul>
 <li> 
  <a href="#">Tag</a>
 </li>
<ul>

On my LI tag, I have a border bottom set to the background color.

When my link is hovered I want to change the color of it?

How do I change the previous elements style?

ul li a:hover{
 text-decoration: none;
 color: #Blue;
}
 
ul li a:hover li{
 border-bottom: solid 5px #Green;
}

Hi all,

How come position sticky does not work for .tabcontent?

If you press "AC-brytare" you can see some content on the right.

I would like .tabcontent (right) to follow down the page as the left menu scrolls.

Thanks,
Anders

* {box-sizing: border-box}

body {font-family: "Lato", sans-serif;}
/* Style the tab */
.tab {
float: left;
border: 1px solid #ccc;
background-color: #f1f1f1;
width: 40%;
height: 100%;
}

Is it possible to give a selected option in a a different colour and if so how? Thanks

I am familiar with the concept of inheritance but cannot determine how to fix my CSS. Because I'm using an iframe tag, it appears that unless I set the desired height attribute for head, body, div (the one marked with ID #content), and iframe to 98% (or any other desired number), the presentation collapses. Each tag seems to requires the height attribute. (This is my first use of the iframe tag.)

I've been asked to be honorary editor of an online magazine and I'm trying to bring it up to date. As well as writing and editing content, I want to look at using a css file for styling and to bring in Bootstrap for display on different devices. The magazine was born in an age when phones were dumb or dumber and everyone viewed pages on a desktop!

I only have basic knowledge of CSS and a reasonable familiarity with HTML, sufficient to know when something is inefficient! Some parts I cannot change, ie the corporate style.