Broadscope ipad

5 posts from 3 voices

• Started 1 year ago by herrbirk
• Latest reply from herrbirk
• This topic is closed
• This topic is not a support question

Tags:

No tags yet.

1. 

   herrbirk
   Member

   Hi,

   Thirst of all i love your Broadscope theme. The only challenge i face is to narrow the midsection with text content for viewers on an ipad. Is it possible to give this section a little left indent? On an ipad it's nice to have the navigation and slider to stick to both sides but not the text.
   It's hard to explain with text so here's an example in a picture: http://www.mosselaarschoenen.nl/example.jpg

   Thanks in advance

   Jasper

   Posted 1 year ago #
2. 

   Ismael
   Moderator

   Hello,

   You might want to use media queries to target that specific selector when viewing on ipad.

   /* iPads (portrait and landscape) ----------- */
   @media only screen
   and (min-device-width : 768px)
   and (max-device-width : 1024px) {
   /* Styles */
   }

   This article might help. :)

   http://css-tricks.com/snippets/css/media-queries-for-standard-devices/

   Regards,
   Ismael

   Posted 1 year ago #
3. 

   herrbirk
   Member

   Hi Ismael,

   Thank you so much for your reply. This sounds a bit daft but I don't know were to put this code.

   Cheers Jasper

   Posted 1 year ago #
4. 

   Devin
   Moderator

   Hi herrbirk,

   In your themes css folder is a file called custom.css. You can put the css in there. You'll most likely need to FTP to your host and download the file then once you've made the changes and saved upload them again.

   You can also add it into the box marked Quick CSS at the bottom of the layout and styling tab in the theme options.

   Just know you'll need to adjust the css Ismael provided for your needs, just pasting it into there wont actually modify anything.

   Regards,

   Devin

   Posted 1 year ago #
5. 

   herrbirk
   Member

   Hi Devin and Ismael,

   Thank you so much for showing me the power of media queries in dummy style. I've put this code within custom.css don't know if it's allright but it works. example view on ipad: http://www.mosselaarschoenen.nl

   @media only screen
   and (min-device-width : 768px)
   and (max-device-width : 1024px)
   {
   	.container{
   width: 97%;
   	}
   	.avia_mega{
   width: 900px;
   	}
   	.avia_mega{
   	font-size: 11.5px;
   }
   }

   Cheers, Jasper

   Posted 1 year ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.