Sort of... You can apply style rules to web pages that specify the heading size in proportion to the size of ordinary text, and that should allow them to zoom proportionately.

By default, these values are:

• ordinary text: 1em = 16 pixels
• h1: 2em, or 2 x 16 pixels = 32 pixels
• h2: 1.5em, or 1.5 x 16 pixels = 24 pixels
• h3: 1.17em, or 1.17 x 16 pixels = 18.7 pixels

To re-proportion the headings, you could try this set of rules:

h1 {font-size:1.4em !important;}
h2 {font-size:1.25em !important;}
h3 {font-size:1.1em !important;}

To apply that to pages, you have two choices:

(1) userContent.css file

This is a file that does not ship with Firefox but can be created in your active settings folder (AKA Firefox profile folder). It's efficient in that it doesn't require an add-on, but only is read at startup, so fine-tuning rules is a chore.

(2) Stylish extension

This add-on allows you to create rules that you can edit and preview instantly so you can see whether you like the result.

There are numerous threads describing how to use these two tools, and for Stylish, the userstyles.org site contains many examples of rules you can try out.

Hope this helps.

Two other notes:

(1) If zoom breaks the layout, you might be using "Text Only" zoom. To switch to "full page zoom" you can:

tap the Alt key > View menu > Zoom > uncheck Zoom Text Only

(2) The forum software detected your Firefox as version 12. Is that correct?

Version 12 is not secure; Mozilla discloses security flaws after each new release. Is something holding you back from upgrading to Firefox 22? Please let us know so we can suggest solutions or workarounds.

If Help > About Firefox shows Firefox 22.0, you may need to clear the preference that is misreporting your version number. See: How to reset the default user agent on Firefox.

thanks very much, jscher2000.

i just added the Stylish123 plugin, and hope to find an example to follow to make headings smaller, since i have to make the content-font size quite large--then the headings and line spacings can take up a quarter of the page.

yes, i am using ff v.12. i tried to upgrade a while back and some of my favorite plugins would not install in the newer versions, so i switched back to v.12 which takes all but the "find duplicate bookmarks" addon (or something like that).

i guess i can try a newer version, but my plugins are very important to me: no squint, yet another smooth scrolling, toolbar buttons, download helper, add to search bar, adblock, and now "stylish."

if i can get stylish to work on leveling the headings-font sizes to just slightly bigger than the content-font size, i'll come back here and report.

i think a userContent.css file would be completely beyond my coding skills, unless there are fill in the blank templates.

thanks again for your thoughtful counsel, jscher2000

Hello again. I did look at Stylish, but this seems to require a setting for each separate web page i might look at, but i hope to install one-time heading-font-size control which will apply to each and every web page i view, based on the text or content size on that page--or alternately, as a fixed size 15 or 16 font.

i also looked in my FF profiles folder but did not see any .css files to use as a guide. and searching FF support for how to write and install a user .css file was not productive.

i seem to remember early FF versions had a choice for user .css or the webpage .css file in the font choices options page. but i can't find this now. (or perhaps it was Opera that had the user .css choice)

if you could point me to an example i could copy which will control the h1, h2, etc. headings as only a little bit larger than the size of the text/content font on every web page the FF displays, then i would like to install that. and please tell me where to install that .css file.

oh, yes, and i'd like to be able to change line spacings. i'm using the comic font because it is the most legible, i think, but i'd like to reduce the line spacing for comic, particularly in the h1 h2 h3 headings.

here is the userContent.css file i added to the FF profile default folder C:\....\Application Data\Mozilla\Firefox\Profiles\z7hau5ip.default

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
html, address,
blockquote,
body, dd, div,
dl, dt, fieldset, form,
frame, frameset,
h1, h2, h3, h4,
h5, h6, noframes,
ol, p, ul, center,
dir, hr, menu, pre   { display: block; unicode-bidi: embed }
li              { display: list-item }
head            { display: none }
table           { display: table }
tr              { display: table-row }
thead           { display: table-header-group }
tbody           { display: table-row-group }
tfoot           { display: table-footer-group }
col             { display: table-column }
colgroup        { display: table-column-group }
td, th          { display: table-cell }
caption         { display: table-caption }
th              { font-weight: normal; text-align: center }
caption         { text-align: center }
body            { margin: 8px }

h1 {font-size:1.25em !important;}
h2 {font-size:1.17em !important;}
h3 {font-size:1.1em !important;}

h4, p,
blockquote, ul,
fieldset, form,
ol, dl, dir,
menu            { margin: 1.12em 0 }
h5              { font-size: .83em; margin: 1.5em 0 }
h6              { font-size: .75em; margin: 1.67em 0 }
h1, h2, h3, h4,
h5, h6, b,
strong          { font-weight: normal }
blockquote      { margin-left: 40px; margin-right: 40px }
i, cite, em,
var, address    { font-style: italic }
pre, tt, code,
kbd, samp       { font-family: monospace }
pre             { white-space: pre }
button, textarea,
input, select   { display: inline-block }
big             { font-size: 1.17em }
small, sub, sup { font-size: .83em }
sub             { vertical-align: sub }
sup             { vertical-align: super }
table           { border-spacing: 2px; }
thead, tbody,
tfoot           { vertical-align: middle }
td, th, tr      { vertical-align: inherit }
s, strike, del  { text-decoration: line-through }
hr              { border: 1px inset }
ol, ul, dir,
menu, dd        { margin-left: 40px }
ol              { list-style-type: decimal }
ol ul, ul ol,
ul ul, ol ol    { margin-top: 0; margin-bottom: 0 }
u, ins          { text-decoration: underline }
br:before       { content: "\A"; white-space: pre-line }
center          { text-align: center }
:link, :visited { text-decoration: underline }
:focus          { outline: thin dotted invert }

}

AFAIK there has been no change on any webpage visited.

also installed firebug and extra tools, but that is hopelessly confusing.

Hi 3katie3, are you saying the userContent.css rule worked (and solved your problem) or didn't work?

If Firefox is ignoring it, could you try deleting that @namespace line from the file, save, and restart and see whether that helps?

Note that this @namespace is used in the userChrome.css file.

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

For userContent.css you can consider to use this line:

@namespace url("http://www.w3.org/1999/xhtml");

Also note that you can restrict CSS rules to specific domains or URLs.

@-moz-document domain(support.mozilla.org)
@-moz-document url-prefix(https://support.mozilla.org/en-US/)
@-moz-document url(https://support.mozilla.org/en-US/questions/963378)

thank you for your suggestions cor-el and jscher2000. i modifed my userContent.css file as shown above by deleting the namespace line entirely, and also trying these entries:

@namespace url("http://www.w3.org/1999/xhtml"); and @namespace url(http://www.w3.org/1999/xhtml);

but none of these 3 variations changed the way the webpages which i visit every day looked and the headings were all the usual size they always have been.

i tried these 3 variations on a half dozen different sites, with no affect.

i also tried disabling the no-squint FF add-on, and i changed the FF content option to let the webpages display their own fonts and sizes rather than my selection, and then changed them back to display my fonts and sizes.

nothing i have done has been able to reach the font display.

i'll try anything else you can suggest.

after looking through the firebug app on several different web sites, it seems there are many levels of display controls/code elements which are able to affect the final appearance. i wonder how FF determines which of the controls to use in the final display. maybe there isn't any way to tell without close inspection of the source and FF configuration

Could you double-check the folder where you saved the file? It needs to be in a subfolder of your profile named chrome.

Also, could you try simplifying the file to contain just the following:

h1 {font-size:1.25em !important;}
h2 {font-size:1.17em !important;}
h3 {font-size:1.1em !important;}

Hi jscher2000,

i searched C drv for "Chrome" and took 2 screenshots saved in monochrome to reduce file size enough to upload. (left side and right side of search panel) if i can upload them, please tell me where to paste userContent.css which will contain only these lines: h1 {font-size:1.25em !important;}

h2 {font-size:1.17em !important;}

h3 {font-size:1.1em !important;}

When Firefox is installed, it does not automatically create the chrome folder. You can create a new folder in your profile folder:

C:\....\Application Data\Mozilla\Firefox\Profiles\z7hau5ip.default 

So it will appear one or a few spots below bookmarkbackups.

well, jscher2000, i think the new chrome folder

C:\Documents and Settings\Administrator\Application Data\Mozilla\Firefox\Profiles\z7hau5ip.default\chrome\userContent.css

with just these 3 lines: h1 {font-size:1.25em !important;} h2 {font-size:1.17em !important;} h3 {font-size:1.1em !important;}

is having an effect on the display fonts.

there are other elements with too-large font sizes which seem to be designated as table elements?

so i am going to try adding more lines to the userContent.css file in the same form as the h1 h2 h3 lines you suggested to make the web pages much more readable, and more like professional print pages rather than jangly advertising layouts.

i guess i'll close this topic now by clicking the "question solved" button.

thanks again for sticking with this till it was solved.

Note that you can make such rules work domain specific or URL specific with an @-moz-document domain(){} or url(){} block.

• https://developer.mozilla.org/en-US/docs/Web/CSS/@document

@-moz-document domain(support.mozilla.org), domain (xxxx){ body, body * { font-size: 1em !important; } }