Navigation
Archive / Column question for iPad and small screens
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • February 21, 2017 at 3:49 pm #1380409
    Stanley Tan
    Participant

    Hi,
    Our product page uses the 1/2 + 1/4 + 1/4 column format but in an iPad, it still uses 1/2 + 1/4 + 1/4 and it looks cramped. I have attached a screenshot of this and link to the page is http://www.selbys.net/flags/street-flags/

    How can we make the 1/2 column to be full width on an iPad and for the 1/4 + 1/4, make it 1/2 + 1/2?

    Stan

    February 21, 2017 at 11:56 pm #1380887
    Friech
    Moderator

    Hi Stan,

    Thanks for writing in! Please add this on your Custom CSS on Customizer.

    /* iPad Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1) {
  	.x-column.x-sm.atf-col-1 {
  		width: 100%;
  		margin-right: 0;
  	}
  	.x-column.x-sm.atf-col-2, .x-column.x-sm.atf-col-3 {
  		width: 48%;
  	}

}

    Hope it helps, Cheers!

  • Author
    Posts
  • <script> jQuery(function($){ $("#no-reply-1380409 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>