p {font-family: Arial, Helvetica, sans-serif; }
td { font-family: Arial, Helvetica, sans-serif; font-size: 11px;}
input { font-family: Arial, Helvetica, sans-serif; font-size: 11px;}
textarea { font-family: Arial, Helvetica, sans-serif; font-size: 11px;}
select { font-family: Arial, Helvetica, sans-serif; font-size: 11px;} make changes one at time and see the result
Does td.categories exist already? If so, you can just modify that selector that already exists.
If you don’t have any CSS applied to that already, you can throw that ssnippet in ANY css file you want :).
Hello RyanReese,
I can not find any td.categories with a search,
so I can paste into the style.css file ?
td.categories{ padding-bottom:.5em;}/do this to increase spacing between items/
td.categories a{ font-size:150%;}/do this to increase font-size/
for example:
/* v6.02 CSS */
/* GLOBAL classes - skin & pages */
td.categories{ padding-bottom:.5em;}/do this to increase spacing between items/
td.categories a{ font-size:150%;}/do this to increase font-size/
body {font-family: Arial, Helvetica, sans-serif; }
p {font-family: Arial, Helvetica, sans-serif; }
td { font-family: Arial, Helvetica, sans-serif; font-size: 11px;}
input { font-family: Arial, Helvetica, sans-serif; font-size: 11px;}
textarea { font-family: Arial, Helvetica, sans-serif; font-size: 11px;}
select { font-family: Arial, Helvetica, sans-serif; font-size: 11px;}
hr {border: 1px solid #c3c3c3;}
.toplink { font-size: 11px; color: #124490; text-decoration: none; }
.toplink a { font-size: 11px; color: #124490; text-decoration: underline; }
.toplink a:hover { font-size: 11px; color: #124490; text-decoration: none; }
Yes, you should be able to just do taht :).
Hi RyanReese,
code added
td.categories{ padding-bottom:.5em;}/do this to increase spacing between items/
td.categories a{ font-size:120%;}/do this to increase font-size/
into the Themes / styles.css (as in above post)
yet no change to font size, home page loads with exactly the same size fonts
ideas please?
You must have something overriding those styles then 
Surely you have more CSS than that.
Or perhaps the change you made isn’t even noticeable to you. Try setting a red background just for fun. If it doesn’t catch on, you either have a specificity issue, or you aren’t selecting it properly.
Make sure to refresh the page, or clear your cache. The browser will be using an old version of the CSS file until you do that. The changes you made show up for me.
Hi RyanReese
ok success got it, font size in Categories has increased,
But!
I would like the font size in every area/every page/ on the entire site to increase,
better to use 1 line for all/every area in the site?
or individual lines for each area? like Categories: td.categories a{ font-size:150%;}/do this to increase font-size/
Hello ralph.m
I have had some success adding the lines
td.categories{ padding-bottom:.5em;}/do this to increase spacing between items/
td.categories a{ font-size:150%;}/do this to increase font-size/
into the style.css
yet if you look at my page
http://trade.comeze.com/index.php
you will see when you Mouse Over the Categories the smaller/original Font shows
I’ll give you a hint, if on hover the font changes, you need to look in your CSS for any rules that has the pseudo class :hover in it.
Look at all of them, you should find at least ONE with a font size setting on it. Go from there :).
Good luck.
Yes, you need to get rid of the line in red in style.css (line 196 or thereabouts):
.categories a:hover {
color: #666666;
font-family: Verdana,Arial,Helvetica,sans-serif;
[COLOR="#FF0000"]font-size: 11px;[/COLOR]
text-decoration: underline;
}
Hi ralph.m:) great help thank you,
I have:
.c1 { background-color: #ffffff; }
.c2 { background-color: #f1f1f1; }
.c3 { background-color: #2fb4de; color: #FFFFFF; }
.c3 a { font-size: 10px; color: #FFFFFF; text-decoration: underline; }
.c3 a:link { font-size: 10px; color: #FFFFFF; text-decoration: underline; }
.c3 a:hover { font-size: 10px; color: #FFCC00; text-decoration: none; }
.c3 a:visited { font-size: 10px; color: #FFFFFF; text-decoration: underline; }
.c4 { background-color: #3366CC; color: #FFFFFF; font-weight: bold;}
.c4 a:link { font-size: 10px; color: #FFFFFF; text-decoration: underline; }
.c4 a:hover { font-size: 10px; color: #FFCC00; text-decoration: none; }
.c4 a:visited { font-size: 10px; color: #FFFFFF; text-decoration: underline; }
.white { background-color: #ffffff; }
yet how do I increase all the font sizes for the complete page/site?
Remove all the font-size declarations in your code above (e.g. font-size: 10px;) and declare the desired font size on your body element (as mentioned in post #2):
body {
font-size: 1.5em;
}
Hi ralp.m, ok so if I remove the
td.categories{ padding-bottom:.5em;}/do this to increase spacing between items/
td.categories a{ font-size:150%;}/do this to increase font-size/
and replace it with
body {
font-size: 1.5em;
}
or
body {
font-size: 150%;
}
and remove all/any font-size: 11px;
then the complete page/site Categories and all with have their Font size increased ?
If you do all that, then everything on the page will have that body font size applied. It cascades down to all children unless specified otherwise.
If you remove all the individual font sizes and put the one declaration on the body element, most elements will be the same size, except things like headings, which have their own default sizes.
Once you make the change, you can then go back and add any more specific font sizes you want.
I would recommend that you set the body font size to 100% and then go and set font sizes on each element as desired. Set them in ems rather than px.
Also, don’t remove the padding settings, as you will lose all padding. This is just a font size issue.
Hi ralp.m & RyanReese
ok so to individually adjust Fonts sizes I would add:
td.categories{ padding-bottom:.5em;}/do this to increase spacing between items/
td.categories a{ font-size:150%;}/do this to increase font-size/
td.menulink{ padding-bottom:.5em;}/do this to increase spacing between items/
td.menulink a{ font-size:150%;}/do this to increase font-size/
td.login{ padding-bottom:.5em;}/do this to increase spacing between items/
td.login a{ font-size:150%;}/do this to increase font-size/
td.mainhead{ padding-bottom:.5em;}/do this to increase spacing between items/
td.mainhead a{ font-size:150%;}/do this to increase font-size/
yes or no ? or?
With the body font size set, that’s the default. If you add in that CSS you just posted, then THOSE <td>s and <a>'s you specified with your CSS, THOSE will have different padding/font sizes.
Some elements like Ralph mentioned have default font sizes, aka <h1>'s, and need to be addressed differently.
If you want those styles on all of your table cells and links, you could just do this:
td {padding-bottom:.5em;}
td a {font-size:150%;}
If not all <td>s and links inside them are to have those styles, you could at least simplify your code to:
.categories, .menulink, .login, .mainhead{ padding-bottom:.5em;}
.categories a, .menulink a, .login a, .mainhead a { font-size:150%;}
Give that a try, and if there’s a problem, we can help you sort it.
Hi all
ok what have changed is below,
added: body {font-size: 150%;}
removed: font-size: 11px; etc
yet no change (cache emptied) still only Categories increased in size, and Hover over still small Font size
…
body {
font-size: 150%;
}
a { color: #003399; text-decoration: underline;}
a:hover { color: #0099FF; text-decoration: none;}
.menulink { font-family: Helvetica, Arial, sans-serif; padding-left: 8px;} /font-size: 11px;/
.menulink a { color: #003399; text-decoration: none;}
.menulink a:hover { color: #0099FF; text-decoration: underline;}
.login {font-family: Tahoma, Verdana, sans-serif; font-size: 11px; }
.explain { border-bottom: 1px dotted #aaaaaa;}
.sh {
/*font-size: 10px; */
color: #000000;
font-weight: bold;
background-image: url(images/sh.gif);
background-repeat: no-repeat;
background-position: center;
}
.sysmessage { background-color: #FFFFE1; border: 1px dashed #CFCFCF; margin-top: 3px; margin-bottom: 3px; padding: 6px; line-height: 18px; }
.sh a { font-size: 10px; color: #000000; text-decoration: none; font-weight: normal;}
.sh a:hover { font-size: 10px; color: #000000; text-decoration: none; font-weight: normal;}
.atitle { color: #003399; font-weight: bold; /* font-size: 11px;*/
background-image: url(images/a.gif);
background-repeat: no-repeat;
background-position: 5px;
padding-left: 20px;
height: 17px;
}
.atitle a { color: #003399; } /font-size: 11px;/
.atitle a:hover { color: #0099FF; font-size: 11px; text-decoration: none; }
.alink { font-family: Helvetica, Arial, sans-serif; color: #003399; font-weight: normal; /font-size: 11px;/
background-image: url(images/ay.gif);
background-repeat: no-repeat;
background-position: 6px 3px;
padding-left: 18px;
padding-bottom: 3px;
text-decoration: none;
}
.alink a { color: #003399; font-weight: normal; text-decoration: none;} /font-size: 11px;/
.alink a:hover { color: #0099FF; font-weight: normal; text-decoration: underline;} /font-size: 11px;/
/* frame borders */
.ftop {border-top: 1px solid #cdcfdc; background-color: #f6f8fa;}
.fside {border-left: 1px solid #cdcfdc; border-right: 1px solid #cdcfdc; background-color: #f6f8fa;}
.fbottom {border-bottom: 1px solid #cdcfdc; background-color: #f6f8fa;}
.ftopw {border-top: 1px solid #cdcfdc; background-color: #ffffff;}
.fsidew {border-left: 1px solid #cdcfdc; border-right: 1px solid #cdcfdc; background-color: #ffffff;}
.fbottomw {border-bottom: 1px solid #cdcfdc; background-color: #ffffff;}
.mainhead {
font-family: Helvetica, Arial, sans-serif;
font-size: 17px;
font-weight: normal;
color: #464a51;
padding-top: 3px;
padding-bottom: 2px;
padding-left: 10px;
border-top: 2px solid #2fb4de;
background-image: url(images/bg_p.gif);
background-repeat: repeat-x;
background-position: top;
}
.mainhead1 {
font-family: Helvetica, Arial, sans-serif;
font-size: 17px;
font-weight: normal;
color: #464a51;
padding-top: 3px;
padding-bottom: 2px;
padding-left: 10px;
border-top: 2px solid #ff8800;
background-image: url(images/bg_p.gif);
background-repeat: repeat-x;
background-position: top;
}
.version { font-family: Helvetica, Arial, sans-serif; font-size: 10px; font-weight: light; color: #555555; padding-top: 4px; letter-spacing: 3px;}
.icontext { font-family: Helvetica, Arial, sans-serif; font-size: 10px; font-weight: light; color: #555555; padding-top: 3px; letter-spacing: 1px; }
.errormessage { background-color: #FFFFE1; border: 1px dashed #CFCFCF; margin-top: 8px; margin-bottom: 16px; padding: 6px; line-height: 18px; }
.copy { font-family: Helvetica, Arial, sans-serif; font-size: 10px; font-weight: light; color: #555555; padding-top: 10px;}
.head {
font-family: Tahoma, Arial, Helvetica, sans-serif;
font-size: 13px;
font-weight: bold;
color: #777777;
}
.header {
background-color: #4192DE;
font-weight: bold;
color: #FFFFFF;
}
.header a:link { color: #FFFFFF; text-decoration: underline; } /font-size: 10px;/
.header a:hover { color: #00FF00; text-decoration: underline; } /font-size: 10px;/
.header a:visited { color: #FFFFFF; text-decoration: underline; } /font-size: 10px;/
input {
font-family: Helvetica,Arial, sans-serif;
/font-size: 10px;/
}
select {
font-family: Helvetica, Arial, sans-serif;
/font-size: 10px;/
}
textarea {
font-family: Helvetica, Arial, sans-serif;
/font-size: 11px;/
}
.c1 { background-color: #ffffff; }
.c2 { background-color: #f1f1f1; }
.c3 { background-color: #2fb4de; color: #FFFFFF; }
.c3 a { color: #FFFFFF; text-decoration: underline; } /font-size: 10px;/
.c3 a:link { color: #FFFFFF; text-decoration: underline; } /font-size: 10px;/
.c3 a:hover { color: #FFCC00; text-decoration: none; } /font-size: 10px;/
.c3 a:visited { color: #FFFFFF; text-decoration: underline; } /font-size: 10px;/
.c4 { background-color: #3366CC; color: #FFFFFF; font-weight: bold;}
.c4 a:link { color: #FFFFFF; text-decoration: underline; } /font-size: 10px;/
.c4 a:hover { color: #FFCC00; text-decoration: none; } /font-size: 10px;/
.c4 a:visited { color: #FFFFFF; text-decoration: underline; } /font-size: 10px;/
.white { background-color: #ffffff; }
.grey { background-color: #E0E0E0; }
.c5 {background-color: #8BC6EF;}
.c6 {background-color: #EEF2F9; color: #003399;}
.c7 {background-color: #E3E4EB;}
.c8 {
background-color: #0C6CBB;
color: white;
font-weight: bold;
}
.c9 {
background-color: #acc7ef;
}
.reguser { font-size: 9px; background-color: #FFFFFF; color: #666666;} /* small text for comments*/
.border {border: 1px solid #ACC7EF;}
/.border { border: 1px solid #4192DE;}/
h2 { color: #888888;}
.boxmain {
background-color: #F4F6F8;
border: 1px solid #93A5BC;
}
TD {
font-family: Helvetica, Arial, sans-serif;
/font-size: 11px;/
}
.borderright {
border-right: 1px dashed #777777;
}
.bordertop {
border-top: 1px solid red;
}
.borderbottom {
border-bottom: 1px dashed #e9e9eb;
}