The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Need CSS Help with a hover element
trixjo
post May 30 2010, 07:34 AM
Post #1





Group: Members
Posts: 1
Joined: 30-May 10
Member No.: 11,982



Hi there,
Need some CSS guru help. If you visit my link:

http://www.gabbr.com/js/viewer/cmedata/index1.html

and hover over the years (top middles, 2008, 2009, 2010, etc) you will notice an orange bar extending from the top to the bottom of the page. I am trying to get the same effect on the left (month and day) but am unable to do so.

The problem I am having is that I cannot get the orange hover bar to extend off the left of the screen for either #dayleft or for #monthleft. It extends all the way to the right margin of the screen but not the left. The problem is the margin-left: 15px; in #monthleft and margin-left: 80px; in #dayleft. But I cannot get rid of these since I require them for the letter spacing.

Any advice?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post May 30 2010, 08:32 AM
Post #2


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

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



'left: 0; right: 0' doesn't do anything because you have fotgotten to make A 'position: absolute' for day and month.

I think the effect looks cool, but it causes problems. Try to select some text and you see what I mean.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post May 30 2010, 08:49 AM
Post #3


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

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



Maybe it would work if you instead of extending the A to the bottom (or the right) of the page include a hidden SPAN in the A and then make it 'display: block' when the A is hovered, make it stretch across the page and apply the background color to that. That way you won't have any hover effect on the bar itself.

I think I'm going to steal this idea. I quite like it. smile.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

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

 



- Lo-Fi Version Time is now: 28th March 2024 - 06:35 PM