Changing font size

[KarenBM]

Hi all,

I am having problems with the default font size in Actinic in that it's very small, see attached sreen print, you can hardly read what it says. The "Items in basket" etc shows this clearly against a section of text where I specified the font size. How do I change it? I am using a clean layout.

Many thanks in advance.

Kind regards
Karen

[jont]

Hi Karen,

the font sizes are specified in the actinic.css file found in the SITE1 root folder for that theme

[garyhay]

You can wrap a .css style or font tag around the code for the cart contents.

[jont]

Karen - looking at the attachment is the text beneath the logo actual text or an image? If it is text it may not render properly on everyones screens due to the font you have selected.

[KarenBM]

Sorry it's taken me so long to reply, been away from the computer for a while. Thanks for all your replies, I'll give it a go.

Jont, the text below the image is embedded text. If the recipient computer does not recognise the font will it display a default version? This is something I hadn't really considered, and I am using Tempus Sans ITC throughout my site.

Kind regards
Karen

[jont]

If the viewers PC does not have the font installed it will drop back to the standard subsitute font - best to use either a standard font or even create a small GIF file if you want to keep that particular font

[pinbrook]

or make sure in your css file you name backup fonts

font-family: Tempus Sans ITC, Arial, Helvetica, sans-serif;

everyone has arial, helveticia is for Mac users, san serif picks the the rest.

Nowadays most people have most fonts (windows comes packaged with a fair few), Tempus is probably windows standard install. You would run into problems if you used a font which you had bought or downloaded

[KarenBM]

Hi Karen,

the font sizes are specified in the actinic.css file found in the SITE1 root folder for that theme

Sorry to come back to this one, but where exactly do I do this? This is the contents of the actinic.css file, I cannot see where the size is specified exactly. I need to enlarge the font size of the whole site.

/*cope with inheritance bugs*/
body, table, th, td{
color:NETQUOTEVAR:FGCOLORCSS;
font-size: x-small;
font-family:CUSTOMVAR:ACTCSSFONTFAMILY;
}

/*body specific*/
body{
NETQUOTEVAR:BODYBACKGROUND;
margin-top:0px;
margin-right:0px;
margin-bottom:0px;
margin-left:0px;
}

form{
margin-top:0px;
margin-right:0px;
margin-bottom:0px;
margin-left:0px;
}

a:link{
color:NETQUOTEVAR:LINKCOLORCSS;
font-size:x-small;
text-decoration:none;
}

a:visited{
color:NETQUOTEVAR:VLINKCOLORCSS;
font-size:x-small;
text-decoration:none;
}

a:hover{
color:NETQUOTEVAR:HLINKCOLORCSS;
font-size:x-small;
text-decoration:underline;
}

a:active{
color:NETQUOTEVAR:ALINKCOLORCSS;
font-size:x-small;
text-decoration:none;
}

li{
color:NETQUOTEVAR:FGCOLORCSS;
list-style-type:square;
}

ol{
color:NETQUOTEVAR:FGCOLORCSS;
}

ul{
color:NETQUOTEVAR:FGCOLORCSS;
list-style-type:square;
}

H1, H2, H3, H4, H5, H6 {
font-family:CUSTOMVAR:ACTCSSFONTFAMILY;
}

SELECT {
FONT-FAMILY: Verdana, Geneva, Arial, Helvetica, sans-serif, tempus sans ITC;
}

.actCHECKOUTEM {background-color:NETQUOTEVAR:CHECKOUTEMCSS;}
.actCHECKOUTBG {background-color:NETQUOTEVAR:CHECKOUTBGCSS;}

.actlarger{
font-size: larger;
color:NETQUOTEVAR:FGCOLORCSS;
}

.actsmaller{
font-size: smaller;
color:NETQUOTEVAR:FGCOLORCSS;
}

.actxxsmall{font-size:xx-small;color:NETQUOTEVAR:FGCOLORCSS;}
.actxsmall{font-size:x-small;color:NETQUOTEVAR:FGCOLORCSS;}
.actsmall{font-size:small;color:NETQUOTEVAR:FGCOLORCSS;}
.actregular{font-size:medium;color:NETQUOTEVAR:FGCOLORCSS;}
.actlarge{font-size:large;color:NETQUOTEVAR:FGCOLORCSS;}
.actxlarge{font-size:x-large;color:NETQUOTEVAR:FGCOLORCSS;}
.actxxlarge{font-size:xx-large;color:NETQUOTEVAR:FGCOLORCSS;}

.actwarningcolor{color:NETQUOTEVAR:REQUIREDCOLORCSS;}
.actrequiredcolor{color:NETQUOTEVAR:REQUIREDCOLORCSS;}
.actsearchhighlightcolor{color:NETQUOTEVAR:SEARCHHIGHLIGHTCOLORCSS;}
.actrequired{color:NETQUOTEVAR:REQUIREDCOLORCSS;}
.actwarning{font-size:x-large;color:NETQUOTEVAR:REQUIREDCOLORCSS;}
.actwelcome{font-size:medium;color:NETQUOTEVAR:FGCOLORCSS;}

.actlogotext {font-family:CUSTOMVAR:ACTCSSFONTFAMILY; font-size: x-small; color: #D9090E; font-style: normal; font-weight: bold; text-align: center}
.actlogout{font-size:x-small;color:NETQUOTEVAR:LINKCOLORCSS;}

Many thanks

Kind regards
Karen

[retekdirect]

Depending on which theme you are using, <FONT> tags are (annoyingly) used frequently. Consequently, this may make the formatting of certain text elements a bit haphazard. Do you have a link to the site so we can see the text in question?

Perhaps a silly and obvious question, but could it be your browser's text size that's causing the problem?

Linky please!


Ryan

[jont]

Hi Karen,

most of the sizes in the product description etc are handled by ".actxsmall" towards the bottom of your CSS file try changing the exisitng line

.actxsmall{font-size:x-small;color:NETQUOTEVAR:FGCOLORCSS;}

to

.actxsmall{font-size:small;color:NETQUOTEVAR:FGCOLORCSS;}

x-small is extra-small whereas small is just.. erm.. small

next sizes up are "regular" and then "large"

This will change everything on a global scale site wide - if you want to just change hte size of say the Product Description edit the Act_ProductLine.html template and replace ".actxsmall" for ".actregular" etc wherever necessary

[jont]

You should also change the size specified at the top under "inheritance bugs" from "x-small" to "small" or "regular" etc

[KarenBM]

I'll have a go and change it the way yoiu suggested Jont.

Ryan, the fact that the text is specified as extra small, implies that the text will indeed be extra small, so I doubt it's my browser that's causing the problem, besides, it looks tiny from the Actinic IDE. I have not uploaded the site as yet, been having problems with 1&1 in that their configerations are not what is required for Actinic (should have listened to the wise ones and not gone for a cheaper solution ).

Thanks for your help guys.


Kind regards
Karen