473,224 Members | 1,771 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,224 software developers and data experts.

CSS menu

I have a CSS menu that looks a lot like the navigation menu at L.L.
Bean. What I want to do is make an effect like the one at Microsoft's
website where you go over a link and it makes a box around it that
covers the height of the link but the width of the table not the width
of just the link. How can I get that effect in CSS? Whenever I try to
do a border with padding it doesn't work. Here is my CSS so far
.NavBody {
margin: 0px;
padding: 0 0 0 0;
}
.NavHeaderTD {
background: #6699FF;
}
.NavContentTD {
background: #66CCFF;
}
div.NavHeaderDIV {
padding: 4px 4px 4px 4px;
font-size:10pt;
font-weight: bold;
text-align: center;
text-transform: uppercase;
}
div.NavLinkDIV {
margin: 1px 0px;
padding-right: 5px;

}
div.NavLinksDIV {
margin-left: 13px;
}
a.NavLinkA:link, a.NavLinkA:visited {
color: #000000;
text-decoration: none;
}
a.NavLinkA:hover {
border: solid 1px #000000;
background-color: #6666FF;
color: #000000;
text-decoration: none;
}
Jul 20 '05 #1
3 2149
Els
Mark Constant wrote:
I have a CSS menu that looks a lot like the navigation menu at L.L.
Bean. What I want to do is make an effect like the one at Microsoft's
website where you go over a link and it makes a box around it that
covers the height of the link but the width of the table not the width
of just the link. How can I get that effect in CSS? Whenever I try to
do a border with padding it doesn't work. Here is my CSS so far


[snip css]

Difficult to see what happens without a url, and I didn't
feel like guessing your page's html code, so here's for you
to test: add "display:block" to the links, and maybe
"width:100%" will help even further.

--
Els
http://locusmeus.com/
Sonhos vem. Sonhos vo. O resto imperfeito.
- Renato Russo -

Jul 20 '05 #2

"Mark Constant" <co*******@mix-net.net> wrote in message
news:ce**************************@posting.google.c om...
I have a CSS menu that looks a lot like the navigation menu at L.L.
Bean. What I want to do is make an effect like the one at Microsoft's
website where you go over a link and it makes a box around it that
covers the height of the link but the width of the table not the width
of just the link. How can I get that effect in CSS?


You can use :hover with whatever class you assign to the blocks in the menu.
That won't work in IE, though. If you examine what Microsoft does, it uses a
behavior library (an .htc file) that is referenced in /homepage/ms.css, and
*that* won't work in any *other* browser, since it's a Microsoft proprietary
feature. Bring up the Microsoft home page in Mozilla, for example, and
you'll see that it looks very different there.

Jul 20 '05 #3

"Mark Constant" wrote...
I have a CSS menu that looks a lot like the navigation menu at L.L.
Bean. What I want to do is make an effect like the one at Microsoft's
website where you go over a link and it makes a box around it that
covers the height of the link but the width of the table not the width
of just the link. How can I get that effect in CSS?


Are you looking for something like the links on the left side of this page?
http://matroska.org

It was done in CSS I believe.
Pamel
Jul 20 '05 #4

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

1
by: Macamba | last post by:
Hi all, I am currently developing a website for a voluntary organisation. It is my first step in website development. The dynamic menu I developed has some bugs, which I addressed in another...
1
by: ajay | last post by:
I have following code for a slide menu but i twiked it to work for a single level menu. Open it in a Browser to get a clear picture. I have 2 Qs 1) How to make first entry as non-link. i.e i...
2
by: Jackson Yap | last post by:
can someone kind enough to help me look at the attached html and js file? Why is it that the javascript menu could not work at www.apchosting.net but could work at...
8
by: Dennis C. Drumm | last post by:
Is there a way to modify the standard context menu shown when someone right clicks in a windows text box and that would work for all open windows applications? The standard context menu for...
1
by: Anthony | last post by:
Below is a script I found at http://javascript.internet.com/ for a cascading menu. The script works great but there is one thing that I would like modified. BecauseI am just learning javascript,...
4
by: TycoonUK | last post by:
Hi, As I do not have IE7 on my computer, I was wondering if there is a fault in my CSS Menu when using IE7. Please can someone look at my site - http://www.worldofmonopoly.co.uk and tell me...
3
by: Lady Gray | last post by:
Link to site: http://kukuwhelkrevolution.artistyandprose.com/Index/ Here's the HTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"...
1
isladogs
by: isladogs | last post by:
The next online meeting of the Access Europe User Group will be on Wednesday 6 Dec 2023 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, Mike...
0
by: veera ravala | last post by:
ServiceNow is a powerful cloud-based platform that offers a wide range of services to help organizations manage their workflows, operations, and IT services more efficiently. At its core, ServiceNow...
3
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 3 Jan 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). For other local times, please check World Time Buddy In...
0
by: jianzs | last post by:
Introduction Cloud-native applications are conventionally identified as those designed and nurtured on cloud infrastructure. Such applications, rooted in cloud technologies, skillfully benefit from...
0
by: abbasky | last post by:
### Vandf component communication method one: data sharing ​ Vandf components can achieve data exchange through data sharing, state sharing, events, and other methods. Vandf's data exchange method...
2
by: jimatqsi | last post by:
The boss wants the word "CONFIDENTIAL" overlaying certain reports. He wants it large, slanted across the page, on every page, very light gray, outlined letters, not block letters. I thought Word Art...
2
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 7 Feb 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:30 (7.30PM). In this month's session, the creator of the excellent VBE...
1
by: davi5007 | last post by:
Hi, Basically, I am trying to automate a field named TraceabilityNo into a web page from an access form. I've got the serial held in the variable strSearchString. How can I get this into the...
0
by: MeoLessi9 | last post by:
I have VirtualBox installed on Windows 11 and now I would like to install Kali on a virtual machine. However, on the official website, I see two options: "Installer images" and "Virtual machines"....

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.