Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Regular Coder
    Join Date
    Dec 2006
    Posts
    417
    Thanks
    168
    Thanked 1 Time in 1 Post

    CSS troubles, need help

    Hi there,

    I am trying to get a specific UI/menu effect but am having difficulty.

    The preview is here:
    http://www.gabbr.com/js/viewer/cmedata/index.html

    I am trying to make a calendar. When users hover over the Month and Day on the left I am trying to make the hover CSS provide a horizontal opacity 60% highlight across the screen (same way I did it for the Year when it is hovered over except it needs to be horizontal rather than vertical).

    A second problem is that the Month and Day aren't lining up in their respective elements.

    The Month should be in the blue element and the Day should be in the red element container. As you can see they are shifted to the right despite the padding being 0.

    Can someone please help?

    The CSS is in the header of the document and it validated (save for the opacity settings)

  • #2
    Regular Coder optimus203's Avatar
    Join Date
    Sep 2008
    Location
    CT
    Posts
    317
    Thanks
    22
    Thanked 16 Times in 15 Posts
    Not sure about the horizontal highlight across the whole screen, but these revisions seemed to fix the positioning error for sidebar:

    Code:
    #monthleft ul {
      padding-left:5px;
      left: 0;
      margin-left: 0;
    }
    
    #monthleft ul li{
      height: 30px;
      list-style: none;
    }
    
    #dayleft ul {
      padding-left:5px;
      left: 0;
      margin-left:0;
    }
    
    #dayleft ul li {
      height: 30px;
      list-style: none;
    }
    Always thank those CF Users who help you solve issues...
    Connecticut Web Design

  • Users who have thanked optimus203 for this post:

    Bobafart (05-27-2010)

  • #3
    Regular Coder
    Join Date
    Dec 2006
    Posts
    417
    Thanks
    168
    Thanked 1 Time in 1 Post
    Optimus,

    That was gold. Worked perfectly.

    I didn't even think of it as a solution.

    Thanks much!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •