Grow your CSS skills. Land your dream job.

Anthing Slider Issue – CSS Button Position Issue

  • # March 1, 2013 at 2:28 pm

    I’m new to using Anything Slider. I’ve got it installed but I can’t figure out why the two buttons used to move the slides backwards and forward are out of alignment. The button on the left is lower than the button on the right.

    I’ve worked a lot with CSS in the past and with this new page, the menu area background image that I created is not showing up. When I click on the left anything slider button there appears to be a background image showing up behind the button— so I suspect that something going on there between the menu area and the Anything Slider setup. I’ve been looking for overlap area between the 2 menu and anything slider but don’t see any by turning off hiding overflow.

    Here’s the link:

    http://cdpn.io/KCImz

    in code pen.

    I wanted to use the metallic theme for anything slider.
    I have only modified to theme to take out the borders and that is all.

    here’s the site in development:
    http://bailey.cedarvalleygroup.com/index_V3.html

    The buttons do show up on the page in development but not in code pen. I think that is because of their location on the far left and right areas of the page.

    Thanks for any suggestions.
    Sue

    # March 1, 2013 at 6:31 pm

    In your [HomeV3.css](http://bailey.cedarvalleygroup.com/assets/HomeV3.css) on line #113, you have:

    .back {
    width: 20px;
    margin: 0px;
    display:inline-block;
    padding-top:70px;
    }

    *remove padding-top: 70px;*

    Also,

    Check line: #135

    .back:hover {
    background-image: url(../images/MenuHighlight.png);
    background-repeat:no-repeat;
    background-position:left;
    color: #000;
    }

    You are loading wrong image on hover.

    Hope that helps, Alen

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".