#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2013
    Posts
    2
    Rep Power
    0

    Thumbs up CSS Help - Align 6 div


    Hi dear, I'm new on this website and I need a huge help

    I Have to align six different divs of this page in particular: piscinadibarzano.altervista.org/ago/index.html
    to make it ordered like they were disposed on a circle as this old image: piscinadibarzano.altervista.org/agoOLD/satellite1.jpg

    Can anyone please help me, I don't know what to do, tried every possibility....... thank you very much!
  2. #2
  3. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2013
    Posts
    22
    Rep Power
    0
    what grade homework is this for? this should work for super simple cases but I dont know if this would help but in your CSS add positioning like this:
    Code:
    #Image1 {
    position:absolute;
    left:???px;
    top:???px;
    }
    #Image2 {
    position:absolute;
    left:???px;
    top:???px;
    }
    #Image3 {
    position:absolute;
    left:???px;
    top:???px;
    }
    #Image4 {
    position:absolute;
    left:???px;
    top:???px;
    }
    #Image5 {
    position:absolute;
    left:???px;
    top:???px;
    }
    #Image6 {
    position:absolute;
    left:???px;
    top:???px;
    }
    then in your webpage just specify the divs to the id
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2013
    Posts
    2
    Rep Power
    0

    Unhappy


    Doesn't run,
    in the webpage i have this code for the btton:

    "

    <ul class="ch-grid-1">
    <li>
    <div class="ch-item ch-img-1">
    <div class="ch-info-wrap">
    <div class="ch-info">
    <div class="ch-info-front ch-img-1"></div>
    <div class="ch-info-back">
    <h3>Nuoto</h3>
    <p>Entra nella<a href="#">Sezione</a></p>
    </div>
    </div>
    </div>
    </div>
    </li>
    </ul>

    "


    And in the css


    "

    .ch-grid-1 {
    position:absolute;
    left:20%;
    top:20%;
    }


    "

    for the button, but it's not responsive, neither with left:200px; for example... the button stay 20% or 200px far from the left(or right if i put margin right) but is a fixed position

IMN logo majestic logo threadwatch logo seochat tools logo