Skip navigation
Spindrift
Spindrift
Currently Being Moderated

Trouble getting banner rotator control buttons to line up. Please help!

Aug 7, 2012 7:45 AM

Hi guys,

 

I had some help making a banner rotator and it all works fine but I can't get the control buttons to line up with each other properly.

 

You can check my example by clicking here.

 

Basically the left and right control arrows should align with the lights. Does anyone know how I can get them to line up?

 

Thank you,

 

S

256 Views   4 Replies   Latest reply: Spindrift, Aug 7, 2012 8:50 AM
 
Replies
  • osgood_
    Currently Being Moderated
    1. osgood_,
    Aug 7, 2012 8:03 AM   in reply to Spindrift
    Report

    Try adjusting the top-margin on your prev and next css.

     

    .prev {

        background: none no-repeat scroll 0 0 transparent;

        background-image:url(http://spindriftmedia.com/banners/images/prev.png);

        cursor: pointer;

        float: left;

        height: 13px;

        margin: 20px 14px 0 0;

        text-indent: -9999em;

        width: 8px;

    }

     
    |
    Mark as:
  • Spindrift
    Currently Being Moderated
    2. Spindrift,
    Aug 7, 2012 8:26 AM   in reply to osgood_
    Report

    HI Osgood,

     

    Thanks for the reply and useful info!

     

    I tried what you said and it kind of worked but I more want to bring the <ul> up to the level of the arrows, rather than giving the arrows a top margin to bring them down, if that makes sense. I want the black box to be a thin strip.

     

    Any other ideas?

     

    Thank you!

     
    |
    Mark as:
  • osgood_
    Currently Being Moderated
    3. osgood_,
    Aug 7, 2012 8:37 AM   in reply to Spindrift
    Report

    Spindrift wrote:

     

    I tried what you said and it kind of worked but I more want to bring the <ul> up to the level of the arrows, rather than giving the arrows a top margin to bring them down, if that makes sense. I want the black box to be a thin strip.

     

    Any other ideas?

     

     

     

     

     

    Add margin: 0; to your 'banner-rotation ul' css selector (as shown below)

     

     

     

    .banner-rotation ul {

        float: left;

        padding: 1px 0 0;

        width: 148px;

    height:11px;

    margin: 0;

    }

     
    |
    Mark as:
  • Spindrift
    Currently Being Moderated
    4. Spindrift,
    Aug 7, 2012 8:50 AM   in reply to osgood_
    Report

    Fantastic! Thanks Osgood - great help

     
    |
    Mark as:
Actions

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points