WordPress.org

1. NF Graphic Design
   Member
   Posted 6 months ago #
   

   The site is http://www.activeshiftmassage.com

   I am modifying the header and I set up the theme as a child theme of twentyeleven.

   Everything is pretty much working as I want, but I would like the site title and description text to ideally remain as a line of text for each and the font size get smaller as the screen size is smaller.

   I set it up fine for iphones, but when it scales down on my ipad it still it makes both the title and description 2 lines each instead of remaining on one line each and making the font size smaller.

   any help would be appreciated.

   thanks!

2. ClaytonJames
   Member
   Posted 6 months ago #
   

   http://www.w3schools.com/css/css_font.asp

   See the section labeled: Set Font Size With Em

   While I believe that the twentyeleven theme already uses "em" by default in the title and tag line declarations, perhaps just a little tweaking might be required.

3. Christine
   WP Yogi & Forum Moderator
   Posted 6 months ago #
   

   Another idea might be to add a new media query for that breakpoint.
   You can add as many of these as you want. So for example in your child theme style.css, you could have something like:

   @media screen and (max-width: 962px) {
   	  styles for this size...
   }
   
   @media screen and (max-width: 780px) {
            styles for this size...
   }
   
   @media screen and (max-width: 675px) {
             styles for this size....
   }

   etc...

4. NF Graphic Design
   Member
   Posted 6 months ago #
   

   Thanks,

   I do have the fonts set in em,

   Also I did the @media settings for the smaller iphone screen, but I thought that the fonts should still be able to scale down and it would not be necessary for the ipad resolution as it already does a good job of scaling the rest down, it is just the text in the title and description

Reply

You must log in to post.