0
Welcome Guest! Login
0 items Join Now

ROCKETTHEME IS CLOSING ON JUNE 30, 2025. As a thank-you to our community, enjoy 50% off all themes with the promo code THANKYOU before we shut down. Read our Farewell Blog Post for more details.

SOLVED Align a div to the bottom of it's parent

Last Post
Search Topic
    • Ali Samii's Avatar
    • Ali Samii
    • Elite Rocketeer
    • Posts: 629
    • Thanks: 2

    SOLVED Align a div to the bottom of it's parent

    Posted 12 years 2 months ago
    • I am trying to align a div to the bottom of its parent container.

      I added a class .align-bottom to my LESS with the following code:
      .align-bottom {
    position: relative;
    bottom: 0;
}

      I have added the class as a module class suffix, but it has no effect.

      You can see the module positioned in the footer with the content "This is a test" on this page: betelec.ergonomiq.net/societe/qui-sommes-nous

      What am I doing incorrectly?
    • Last Edit: 12 years 2 months ago by Ali Samii.
    • Thank you.

      Ali Samii
    #944664

  • Re: SOLVED Align a div to the bottom of it's parent

    Posted 12 years 2 months ago
    • Hi Ali,

      The problem is your module position has not the same height as the left one.

      You have to update the height and set the align-bottom with an absolute position.

      Here's some LESS code :
      #rt-footer .rt-grid-3.rt-omega {
  height : 260px; //same as .rt-grid-3.rt-alpha
 
  .rt-block.align-bottom {
     position: absolute;
     bottom:0;
  }
}

      Hope it helps,

      Olivier
    • Some useful links :

      Some tips for an efficient process :
      1. When possible, post URL of your website, it's always better to see the problem in REAL
      2. Only one problem per thread please
      3. When problem is solved, just edit your...
    #944791
    • Ali Samii's Avatar
    • Ali Samii
    • Elite Rocketeer
    • Posts: 629
    • Thanks: 2

    Re: SOLVED Align a div to the bottom of it's parent

    Posted 12 years 2 months ago
    • Hi Olivier,

      Merci beaucoup. Ça m'aide.

      Back to English for everyone else's benefit...The height of the left module may change as new menu items are added or some may be removed. How do I make the "This is a test" module bottom-align to the parent container without fixing it's height?
    • Thank you.

      Ali Samii
    #944803

Time to create page: 0.077 seconds