The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> "Pushed Down" Button on Tab, It won't display correctly
montmorency3
post May 7 2009, 08:51 PM
Post #1





Group: Members
Posts: 1
Joined: 7-May 09
Member No.: 8,547



A website I am creating requires the "pushed down" button look on the top tab buttons. For my CSS, I use this code:
________________________________________________________________________________
______

/* Menu */

#menu {
float: left;
width: 600px;
height: 50px;
margin: 0 auto;
}

#menu ul {
margin: 0;
padding: 17px 0 0 20px;
list-style: none;
line-height: normal;
}

#menu li {
display: block;
float: left;
display: inline;
}

#menu a {
display: block;
float: left;
margin-right: 5px;
padding: 0px 20px;
text-decoration: none;
font: 14px Georgia, "Times New Roman", Times, serif;
color: #000000;
height: 40px;
}

#menu a:hover {
background: url(images/img4.gif);
color: #FFFFFF;
}

#menu .active a {
background: url(images/img4.gif);
color: #FFFFFF;
}

_______________________________________________________________________________

However, whenever I view my website, the "pushed down" button picture always is further down than it is suppose to be;
The top text on the tab is flush with the top of the picture, hence the misplacement.
Any suggestions, or causes of problem would be helpful.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post May 8 2009, 02:18 AM
Post #2


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



Please link to a sample page.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 28th March 2024 - 01:30 PM