ATTENTION, PLEASE READ: New topic creation is disabled, as we have moved to a new support system. Your existing topics will remain, but for all new requests you will need to use the new system. Click here to go to the new support request form.

• Back to forum

  Posted in: Dante
• January 15, 2016 at 12:09 am #240624
  bozomax

  Member

  Post count: 16

  Hi!

  I have a problem the display of widgets’ titles. Essentially in Chrome and Edge is ‘shaves off’ the bottom of any title text. For example in this header the lower bit of letter ‘p’ will be shaved off:
  <h3 class="spb-heading spb-text-heading"><span>Get FREE tips!</span></h3>
  which you can see here or on any page there. Changing ‘H3 Font Line Height’ in the theme settings doesn’t help, while reducing the font size does help, however I don’t want to do that for aesthetic reasons.

  This seems to be caused by /dante/style.css:2963 where

  h4.spb-heading, h3.spb-heading, h4.lined-heading{
  ...
  line-height: 0!important; 
  ...

  Removing this, obviously breaks alignment. Changing

  h3.spb-heading {
      margin-bottom: 25px;
  }

  also doesn’t help.

  Any help or updates would be much appreciated!

  Thanks

  Max

  January 15, 2016 at 8:34 am #240660
  Mohammad – SUPPORT

  Moderator

  Post count: 27441

  Hi,
  Everything looks perfect to me. Please attach marked screenshot to indicate the issue.
  Thanks
  Mohammad

  January 15, 2016 at 11:02 am #240715
  bozomax

  Member

  Post count: 16

  Hi!

  That is good on the one hand, since you did not notice, or everything works fine in your browser. 🙂

  So, here are the attachments. sc-1 and sc-2 are from my PC, running Win 10 and Chrome 47.0.2526.111 m. sc-3 and 4 are from iPhone 5c’s Safari, with iOS 9.2. I have underlined with red lines places where bottom bits of certain letters are cut off.

  The font used is a Google Font — Playfair Display 700. <h3> size is set to 22px, as I mentioned before changing h3 lineheight in the theme’s settings has no effect. The same thing happens with any font I use, this is clearly an issue with font size, rather than font itself. If I set <h3> size to, for example, 16px everything fits nicely, but I would like to use larger sizes.

  Also, this may be a separate question. Is there a way to have different font sizes for different devices? One size for desktops and the other, smaller, for mobile devices.

  Thanks,

  Max

  Attachments:

  You must be logged in to view attached files.
  January 15, 2016 at 11:04 am #240721
  Mohammad – SUPPORT

  Moderator

  Post count: 27441

  Hi,
  Just provide me specific page url to check and resolve fast.
  Thanks
  Mohammad

  January 15, 2016 at 11:07 am #240722
  bozomax

  Member

  Post count: 16

  Hi!

  Sure. Check here http://www.ocoach-fitness.co.uk/packages-prices/ Look for widget headers: ‘Get FREE tips’, ‘Online Coaching’, ‘Available Packages and Prices’

  Max

  January 15, 2016 at 11:19 am #240727
  Mohammad – SUPPORT

  Moderator

  Post count: 27441

  Hi,
  Please use this custom css code:-

  .spb-heading{
  line-height:15px !important;
  }
  

  Thanks
  Mohammad

  January 17, 2016 at 9:14 pm #241124
  bozomax

  Member

  Post count: 16

  Hi!

  Thanks! In the end it has worked only when explicitly setting line height of h3:

  h3.spb-heading{
  line-height:10px !important;
  }

  However I still got a question about how to resize the font size for mobile devices. In custom CSS bit I have added this:

  @media handheld {
  h3.spb-heading{
  font-size:16px;
  }
  }

  but that has no effect on the font size on mobile… Any suggestions would be much appreciated!

  Thanks!

  Max

  January 18, 2016 at 5:07 am #241155
  Mohammad – SUPPORT

  Moderator

  Post count: 27441

  Hi,
  Please use this code for mobile device :-

  @media screen and (max-width: 767px) {
  
  h3.spb-heading{
  font-size:16px;
  }
  
  }

  Thanks
  Mohammad

  January 18, 2016 at 10:14 am #241251
  bozomax

  Member

  Post count: 16

  That’s great! This has worked, thank you!

  January 18, 2016 at 10:17 am #241253
  bozomax

  Member

  Post count: 16

  So the problem is resolved.

  January 18, 2016 at 10:42 am #241261
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Great, thanks Mohammad!

• Back to forum

  Posted in: Dante