CODEWITHSUNDEEP
cssalignment
agassi0430
agassi0430

Reputation: 1195

Aligning arrow on the right

I am trying to build a carousel with left and right arrows. How do I align the right arrow to the very right side of the screen? I looked through many post to figure it out, tried both float and align, can't figure it out.

Here's my JSFiddle: http://jsfiddle.net/agassi0430/CcAMD/

Thanks in advance for the help.

Upvotes: 2

Views: 5152

Answers (3)

Bogdan Rybak
Bogdan Rybak

Reputation: 2117

It would be easiest to use position: absolute; on the arrows and align them using right: 0; left: 0; . You also have to remember to set position: relative; to the element that contains them in order for the position absolute to work within that container.

Here's the fiddle.

Also, watch out for your html markup. It's not valid to put anything other than <li><li> (list item) in between <ul></ul> (unordered list)

Upvotes: 3

user1193509
user1193509

Reputation:

I think it will help if you can remove the arrows from the list...but if you need to keep them in the list, try messing around with the display properties. Such as display: inline-block; in your css. Be careful though, some of those don't degrade very nicely in older versions of IE. You may need a minor css hack for IE 7...

Upvotes: 0

suresh gopal
suresh gopal

Reputation: 3156

Please try this:

    <div class="category">Most Discussed</div>
    <div class="contents">    
        <ul><div class="leftarrow"></div></ul>
        <ul><div class="content"></div>
            <li></li>
            <li></li>
            <li></li>
            <li></li></ul>
        <ul style="float:right;"><div class="rightarrow"></div></ul>
    </div>

Upvotes: 0

Related Questions