Advertisement:

Author Topic: How to reduce font size for page title heading in the css  (Read 6094 times)

promotec

  • Newbie
  • *
  • Posts: 8
How to reduce font size for page title heading in the css
« on: November 04, 2013, 05:01:11 am »
Hello can anyone tell me how to reduce the font size of the title heading that comes up by default at the top left of the body area on all created pages, when creating a custom page its what you put in as page title.
I assume its controlled by the main.css in the themes folder but I cant find the correct part to change the font size.
any help would be greatly appreciated
Regards Chris

cofst

  • Newbie
  • *
  • Posts: 17
Re: How to reduce font size for page title heading in the css
« Reply #1 on: November 04, 2013, 12:22:08 pm »
On ../oc-content/themes/bender/css/main.css

change here :
Code: [Select]
h1{font-size:2.2em}

careylist

  • Jr. Member
  • **
  • Posts: 87
Re: How to reduce font size for page title heading in the css
« Reply #2 on: November 04, 2013, 07:08:35 pm »
I did change the number, but it didn't change anything. The title is still VERY BIG. :)

cofst

  • Newbie
  • *
  • Posts: 17
Re: How to reduce font size for page title heading in the css
« Reply #3 on: November 04, 2013, 07:21:23 pm »
It might use the ../oc-includes/osclass/gui/css/main.css folder...

I didn't understand the purpose of the gui folder (is it a cache?)

promotec

  • Newbie
  • *
  • Posts: 8
Re: How to reduce font size for page title heading in the css
« Reply #4 on: November 05, 2013, 02:12:18 am »
my theme is modern not bender, the main.css is in the modern dir not under the css directory
finding the css file isn't a problem, its the matter of finding the statement in the css that represents the page title font size...

regards Chris

teseo

  • Hero Member
  • *****
  • Posts: 6169
Re: How to reduce font size for page title heading in the css
« Reply #5 on: November 05, 2013, 02:52:24 am »
Hi,

Then look for:

Code: [Select]
.page h1 {
    font-size: 2em;
}

in your style.css

Regards

promotec

  • Newbie
  • *
  • Posts: 8
Re: How to reduce font size for page title heading in the css
« Reply #6 on: November 05, 2013, 10:04:50 am »
Many thanks the .page h1 setting did the job I changed to 1 em looks heaps better many thanks :-)

careylist

  • Jr. Member
  • **
  • Posts: 87
Re: How to reduce font size for page title heading in the css
« Reply #7 on: November 05, 2013, 05:21:32 pm »
Hi,

Then look for:

Code: [Select]
.page h1 {
    font-size: 2em;
}

in your style.css

Regards

Teseo,

What about me? :( I am using Bender theme. The only CSS file I see within bender folder is main.css within css folder.

However, I see folder sass within bender folder. I don't know what it is. It has a lots of .sass files in it.

Please, help.

teseo

  • Hero Member
  • *****
  • Posts: 6169
Re: How to reduce font size for page title heading in the css
« Reply #8 on: November 05, 2013, 05:52:36 pm »
http://sass-lang.com/

I don't know if it was a good idea to use SASS and leave the less advanced users having to deal with a minified, one-line traditional style sheet... ???

Anyway, is it your problem also about custom pages title? ???

Regards

tomshaft

  • Hero Member
  • *****
  • Posts: 862
  • Osshaft for Osclass - Add 650 posts to my total
Re: How to reduce font size for page title heading in the css
« Reply #9 on: November 05, 2013, 10:48:45 pm »
@Carylist,
teseo asked if your problem is the same as member promotec ?
If it is then find in the Bender theme css file the following:
#header #logo a {
                    font-size: 1.5em;
                   line-height: 0.8em;
                    font-weight: bold;
                    text-decoration: none;
                    color: #fff
                }
Change font-size: 1.5em; to a lower number for smaller font.
 
Tom
 
Hi,

Then look for:

Code: [Select]
.page h1 {
    font-size: 2em;
}

in your style.css

Regards

Teseo,

What about me? :( I am using Bender theme. The only CSS file I see within bender folder is main.css within css folder.

However, I see folder sass within bender folder. I don't know what it is. It has a lots of .sass files in it.

Please, help.

careylist

  • Jr. Member
  • **
  • Posts: 87
Re: How to reduce font size for page title heading in the css
« Reply #10 on: November 05, 2013, 11:59:29 pm »
 ???

I just did change that in the main.css file to 1.0em and 0.5em. Still, I saw no changes at all.

 :-\

tomshaft

  • Hero Member
  • *****
  • Posts: 862
  • Osshaft for Osclass - Add 650 posts to my total
Re: How to reduce font size for page title heading in the css
« Reply #11 on: November 06, 2013, 01:03:25 am »
Possibly each Bender version has slightly different settings.
Find at or around line 1061 in the main.css file:
#header #logo {
  color: #fff;
  font-family: "Osclass";
  border: none;
  font-size: 2.7em;  - Lower this number for smaller page header logo text.
  line-height: 1.5em;
  padding-top: 10px;
  padding-bottom: 10px;
 
Tom