Heading font in columns

5 posts from 3 voices

• Started 8 months ago by RiboMed
• Latest reply from Nick
• This topic is closed
• This topic is resolved

Tags:

• column heading font

1. 

   RiboMed
   Member

   When I use the shortcode to create columns, the column titles automatically goes to small caps instead of heading font no matter what heading font is used - h1, h2, h3, etc all show up as small caps. Where can I change this? I need to be able to display the column titles with both upper and lower case and bolded font is not big enough. Thanks.

   Posted 8 months ago #
2. 

   Mya
   

   Hi RiboMed,

   Add this to your custom.css or Quick CSS:

   .flex_column h1, .flex_column h2, .flex_column h3, .flex_column h4, .flex_column h5, .flex_column h6 {
   text-transform: capitalize;
   }

   Regards,
   Mya

   Posted 8 months ago #
3. 

   Nick
   Moderator

   Hi,

   If you want this exclusively for the column titles, you would need to make a class and add it to however you designate the title of each column:

   For example:
   

   [three_fourth first]
   <h2 class="H2_title">Title One</h2>
   content content[/three_fourth]
   
   [one_fourth]
   <h2 class="H2_title">Title Two</h2>
   content content[/one_fourth]

   and then add to the Quick CSS text-box in the backend under styling:
   

   H2.H2_custom_class {
   font-size: 2em;
   line-height: 1.3em;
   margin-bottom: 6px;
   font-weight:bold;
   text-transform:capitalize; /*or change to none*/
   }

   or you can add it to any sentence
   

   John said <span class="H2_title">"Hi, I am here"</span>, before closing the door.

   However if you use span as in the second example, you would need to add a second css
   

   .H2_title {
   font-size: 2em;
   line-height: 1.3em;
   margin-bottom: 6px;
   font-weight:bold;
   text-transform:capitalize; /*or change to none*/
   }

   You should change the size of the Post title as well, since it would look strange if some word inside the article is three times bigger than its title.
   

   #top .post-title {
   font-size: 19px; /*current size*/
   line-height: 1.4em;
   font-weight: bold;
   margin-bottom: 10px;
   }

   Good luck,

   Nick

   Posted 8 months ago #
4. 

   RiboMed
   Member

   Thanks Mya and Nick. I have been able to get rid of the all caps and have the column headers bold but still can't get the font to display the same as in the headlines on the pages. I'll keep playing around and see if I can solve the problem. At least being able to use upper and lower case letters solves some of my problem.Thanks

   Posted 8 months ago #
5. 

   Nick
   Moderator

   Hi,

   Glad we could help.

   Your titles are all Droid Sans in Headline and elsewhere, everything else on the page is Helvetica.

   Thanks,

   Nick

   Posted 8 months ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.