Not able to change the state of links in css html

1
PSEUDO CLASS SELECTOR /* i want to style the unordered list as a menu*/ header li { list-style: none; } 
	/*to style the links its not easy as we have to consider their states.*/
	/*let us remove the default styling by removing the uderlined text*/
	/*let us change the inline a element to block element*/

	 a: link {
		color:blue;
		text-decoration: none;
		background-color: gold;
		border:2px solid black;
		border-style: round;
		display:block;
		width:300px;
		text-align: center;
		margin-bottom: 2px;
	}

	 a : visited {
		color:purple;
		text-decoration:none;
	}

	a : hover {
		color : hotpink;
		text-decoration:none;
		background-color: white;
	}

	a : active {
		color : red;
		text-decoration:none;
		background-color: white;
	}
</style>

PEUDO CLASS SELECTOR

	<ul>
		<li><a href = "/">HOME</a></li>
		<li><a href = "https://www.imdb.com/video/vi3024271385?playlistId=tt6129302&ref_=tt_ov_vi" target = "_blank">BHAVESH JOSHI</a></li>
		<li><a href = "https://www.hindustantimes.com/hollywood/sometimes-great-movies-bomb-at-the-box-office-like-bhavesh-joshi-5-films-you-need-to-discover-online/story-UEv87LZS8r8L7codcSN3HK.html" target = "_blank">MOVIES LIKE BHAVESH JOSHI THAT BOMBED T THE BOX OFFICE</a></li>
	</ul>
</header>

<section>
	<div>DIV 1</div>
	<div>DIV 2</div>
	<div>DIV 3</div>
	<div>DIV 4</div>
	<div>DIV 5</div>
	<div>DIV 6</div>
</section>
2

Hi,
It’s kind of hard to read your code, seems like there is a problem with the formatting. Do you have any CSS that targets the ul/li? something like:

ul {
   list-style-type: none;
}
li {
  display: block;
}

Hope that helps.

1 Like
3

There was an error with the syntax.
It is a:visited and not a : visited.
I understood my mistake . Thanks