0
Welcome Guest! Login
0 items Join Now

Center content 960px Gantry template responsive

Last Post
Search Topic
    • JSYMedia's Avatar
    • JSYMedia
    • Sr. Rocketeer
    • Posts: 134
    • Thanks: 1
    • Joomla plus Gantry

    Center content 960px Gantry template responsive

    Posted 9 years 6 months ago
    • I hope this is ok to ask here. I'm stumped.

      I'm trying to make this site: http://dev.texascookietime.org/

      look like this site: http://www.gsnetx.org/

      Align center, 960px, gray sides and stay responsive.

      Everytime I've tried to do something like:
      #rt-top-surround {
	width: 960px;
	margin-left:auto;
	margin-right:auto;
	}

      It looks fine on desktop but the responsive tablet/phone view doesn't look correct (logo off to the right).

      Thanks for any ideas.
    #1140833
    • DanG's Avatar
    • DanG
    • Preeminent Rocketeer
    • Posts: 36750
    • Thanks: 3229
    • Custom work done

    Re: Center content 960px Gantry template responsive

    Posted 9 years 6 months ago
    • JSYMedia wrote:
      It looks fine on desktop but the responsive tablet/phone view doesn't look correct (logo off to the right).

      Thanks for any ideas.

      I only see an issue with the tablet-portrait mode. so, In your
      gantry-custom.css <-{Click the LINK }       file add this:
      @media (max-width: 767px) {
    body.layout-mode-responsive #rt-logo {
        margin-left: -15px !important;
    }
}
    #1140844
    • JSYMedia's Avatar
    • JSYMedia
    • Sr. Rocketeer
    • Posts: 134
    • Thanks: 1
    • Joomla plus Gantry

    Re: Center content 960px Gantry template responsive

    Posted 9 years 6 months ago
    • Yep Dan, that worked and the logo is now centering in tablet view. However I'm still bizarrly stuck at trying to achieve the grey left and right sides and the white body. The body class I'm seeing with the Firefox inspector is:
      body.logo-type-custom.headerstyle-light.font-family-helvetica.font-size-is-large.menu-type-dropdownmenu.layout-mode-responsive.col12

      and I have the background-color set to grey, which works, but then also makes the main article area grey when it needs to be white. I've tried to manually color every div, every grid area, etc and nothing works. What's weird is, I've done this with many Rockettheme templates and never had so much trouble.

      Can you enlighten me?

      This image is hidden for guests.
      Please log in or register to see it.
    #1141656

Time to create page: 0.038 seconds