Why can't I customize this font on my site? (example below) For some reason ya'll put an absolute font style on this particular piece of code in the asp page and it does not match the rest of the fonts on my site. Can this be changed?

Should this be in the "Design Aspects" forum?

I was thinking it should be in the "Ask a " forum...and right after they answer, it will belong in the "Feature Request" area.

Can you post the source code for this part? It might help to see what style class has applied to it.

Here's the code:

What is the class, "CheckoutBody"? Is that something you put in or MC? I don't see anything like that in your style or custom css sheets.

nope nothing I put in. I can't find it on my custom.css or style.css page. Hmmm.

Anybody else's like this? I'm thinking that the class makes no difference, it is taking on the font face tag. Anybody know?

I just checked this out and looked at your style.css and custom.css files. Neither one of them has a CheckoutBody style. Maybe this is something new????

Anyway, bad news... Unfortunately the CSS is coded directly into the HTML as Arial 9pt. So, unless gets rid of it, makes a style for it, and puts it in the Site wide color and font options, it can't be changed.

I'd like to ask why????

WHY DO YOU APPLY CSS STYLES DIRECTLY IN THE HTML CODE??? IT MAKES NO SENSE AND IT'S VERY FRUSTRATING BECAUSE TO MAINTAIN A CLEAN AND PROFESSIONAL LOOK IT FORCES THE MERCHANT TO ADHERE TO 'S STYLE!

Sorry for the rant, but it really irks me.

that's my exact rant jgirly! They do this in a couple of places and I wish they wouldn't.

Why not put ".checkoutBody" in your custom css and style it the way you want? I'd at least try (then later see if it messes up anything else).

Because unfortunately you can't override properties with CSS that are worked into the code.

Example: Let's say I want to set the margins for all occurrences of <P> tags to 2px. I would put this is my custom.css file:

p {margin: 2px;}

The browser would load:
1- style.css, then
2- custom.css, then
3- HTML

Since the HTML loads last, and has CSS in it (<p style="margin-top: 0; margin-bottom: 0">) it will override all of my CSS.

The same exact thing goes for the <font> tag, so even if you make a style called "CheckoutBody" this part will override it. (<font face="Arial" style="font-size: 9pt" )


Does that make sense?

Thanks for explaining, jGirl. I use the "try & see & wonder why" technique! I try things, see if it works then I wonder why it doesn't work! LOL

But yes, what you're saying makes sense. In that case, I join the RANT.

LOL! Welcome to the Rant. Ha ha.

If only would respond...

GirlyGirl is right. When a style is explicitly specified in the HTML code, it supercedes the styles in your style sheets.

Thank goodness we have DHTML, which allows elements on a page to change at any time.

Place this script in your Bottom of Page and adjust the font values accordingly:

I tested in IE6 and Firefox and it works in both.

Keep in mind that this script will modify the font styles for any element that is a member of the CheckoutBody class. If that becomes a problem, then further modification of the script will be in order.

Hope this helps!

Way to go undejj!!

Cool! Thanks Undejj I guess after learning Javascript, DHTML will be next!

Can I be so bold as to ask how we could accomplish this if the CheckoutBody class wasn't there? So, say there's no class and we are using a function call... Could we put the function call in a div tag, give the div tag an ID and use the same script??

Thanks so much for this!

Wow! thanks Undejj! I really appreciate it.

All hail Undejj! We're not worthy...we're not worthy....lol

There are several ways to accomplish the same thing (some better and more efficient than others). Technically, you could put the function inside a div tag. Just remember, the function writes HTML tags, and those are the tags that you will probably want to target.

For example, let's say you have this:


That may translate to this:


.. in which case, assigning a style to the div tag would do you absolutely no good. So you might have to crack the books and learn some fancy JavaScript to do as you asked.

Or you could just use something like this, which works the same magic on nooksandniches original code, and does it with no reference to the class:

Thanks so much for explaining! It's a big help and I really appreciate it.

Any time ..

I just thought of a better way to do this: