SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Addict
    Join Date
    Feb 2013
    Posts
    241
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    how to get these absolute positioned <li> to not stack like this at start?

    hi

    Im making a website and on the startpage i have a slider with testemonials from clients. The paragraphs in the slider is absolute positioned so that i could vertically center them. The thing is at the start untill the first fade/slide they are stacked on top of each other and this looks like **** of course.

    site: www.rosens-bygg.se

    the code for the slides look something like this:

    Code HTML4Strict:
    <div class="slides">
    <li>
    <p>textextext</p>
    </li>
    <li>
    <p>textextext</p>
    </li>
    </div>

    Code CSS:
    .slides{
    position: relative;
    }
     
    li{
    position: absolute;
    display: table;
    left: 0;
    top: 0;
    height: 200px;
    }
     
    p{
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    }

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    23,585
    Mentioned
    411 Post(s)
    Tagged
    6 Thread(s)
    The question isn't clear enough. I don't see anything sliding.

  3. #3
    SitePoint Addict
    Join Date
    Feb 2013
    Posts
    241
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ralph.m View Post
    The question isn't clear enough. I don't see anything sliding.
    Maby i was unclear, i meant fading not sliding. The gray box to the right of the dummytext on the startpage. The text is stacking on top of each other.

    EDIT: solved it, just had to give the <li> a background color.


Bookmarks

Posting Permissions

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