i try to create horizontal menu … here is image

now i want to remove hover color.. e.g contact and also remove underline how i do his?

.HEAD
	{
		text-decoration:none;
		
	}
		
	
	.HEAD li
	{
		display: inline;
		text-decoration:none;
		
	}
	
       . HEAD a
       {
        
       display: block;
    width: 60px;
    	text-decoration:none;
       }

<div class="HEAD">
 <ul class="HEAD">
  <li><a href="default.asp">Home</a></li>
  <li><a href="news.asp">News</a></li>
  <li><a href="contact.asp">Contact</a></li>
  <li><a href="about.asp">About</a></li>
</ul> 
</div>

Hi Bakhtawar,

Bakhtawar Ashiq

       . HEAD a
       {
        
       display: block;
    width: 60px;
    	text-decoration:none;
       }

From your code and description, if you want to remove the underline. You could use the CSS text-decoration Property. It specifies the decoration added to text, such as: underline and none. So, I suppose the issue is related to the above code. Here is an extra space. So, please modify your code as below:

       .HEAD a
       {
        
       display: block;
        width: 60px;
    	text-decoration:none;
       }

For remove hover color, I suppose you are using the hover Selector as below:

a:hover { 
     background-color: yellow;
 } 

So, I suggest you check you code, and remove the code.

With reference to
CSS text-decoration Property and
hover Selector.

If you have any other question about my reply, please let me know freely.

Best Regards,
Dillion

Hi bakhtawar,

According to your requirements , you want to remove hover color and remove underline . I made a test on my computer , it worked fine .

If you want to remove underline , you could set the  text-decoration to none .

In order to remove hover color , you could set the color is same with before , after clicking .

To achieving your goal, please try my code as below,

<style type="text/css">
    .HEAD{
              text-decoration:none;
       }
       .HEAD li{
              display: inline;
              text-decoration:none;
       }
       .HEAD a{
        display: block;
        width: 60px;
       text-decoration:none;
       }
        a {
            text-decoration:none;/*this can remove underline*/
            color:#0000FF;/*choose one colour you need*/
        }
</style>

Best regards,

Aswecan