0
Welcome Guest! Login
0 items Join Now

SOLVED Fixed Module Height and Custom CSS Question

  • SOLVED Fixed Module Height and Custom CSS Question

    Posted 6 years 3 months ago
    • Hello, I need some help with a new website using the Anacron Template.

      I have three modules in the maintop position (A,B,C)

      I would like the modules to all be the same height. The "Join the Newsletter" module is the longest of them all, and having the other two resize to their own height makes the row look off balance.

      How do I make the modules the same height? or even better - resize based on the "join the newsletter" module I have created?

      Another Question I have is how to use the custom css file. I have created the custom css file, followed the directions on the Gantry website on how to create one, but I cannot get it to work. Is there a tutorial on creating a custom CSS file that works with the template? The Gantry site also mentioned something about production mode, but I cannot find that setting anywhere to save my life.

      Any help would be greatly appreciated!
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13481
    • Web Designer/Developer

    Re: SOLVED Fixed Module Height and Custom CSS Question

    Posted 6 years 3 months ago
    • Gantry 4 and Gantry 5 are different frameworks. You need to follow the instructions for Gantry 4 custom CSS file in Anacron (there is no "production" mode in Gantry 4).

      This is how to create a custom CSS compatible with Gantry 4...

      http://docs.gantry.org/gantry4/tutorials/adding-a-custom-stylesheet


      Please would you post your URL, superuser id and pswd in the secure tab of your post and I'll have a look for you.

      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
  • Re: SOLVED Fixed Module Height and Custom CSS Question

    Posted 6 years 3 months ago
    • This message contains only secure information that is visible to Anthony Latino, moderators and administrators
    • Last Edit: 6 years 3 months ago by Anthony Latino.
  • Re: SOLVED Fixed Module Height and Custom CSS Question

    Posted 6 years 3 months ago
    • I filled in my details in the private tab. Thank you for the custom css tutorial - that helped a lot! The problem I am having now is what the class is that controls those modules. That is where I am getting stuck now.
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13481
    • Web Designer/Developer

    Re: SOLVED Fixed Module Height and Custom CSS Question

    Posted 6 years 3 months ago
    • Use this code...
      .menu-home #rt-maintop .rt-block .module-content {
      	min-height: 500px
      }

      If you want you ca also use that in media queries so you can set a different height for each viewport...
      /* Smartphones */
      @media (max-width: 480px) {
      
      }
       
      /* Smartphones to Tablets */
      @media (min-width: 481px) and (max-width: 767px) {
       
      }
      
      /* Tablets */
       @media (min-width: 768px) and (max-width: 959px) {
      
      }
         
      /* Desktop */
      @media (min-width: 960px) and (max-width: 1199px) {
         
      }
          
      /* Large Display */
      @media (min-width: 1200px) {
          
      }


      Media queries work like this:

      if the viewport size is xxxxx then
      use this css
      endif

      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
  • Re: SOLVED Fixed Module Height and Custom CSS Question

    Posted 6 years 3 months ago
    • You are my new hero of the day!

      Thank you so much! Not only did that fix my problem, but now that I understand HOW the CSS works with the template and framework, I can actually move forward with lots of little issues that have cropped up!

      Again, thank you for taking the time to explain this!

Time to create page: 0.069 seconds