How To Prevent That User Agent Style Sheets Are Changing My Font Size

[Pippo3000]

every once in a while we run into new issues. the latest: I checked the order process and realized that the font in the shopping cart and one-page checkout is way too big in many parts. see example attached, the header line (like "artikel" or "beschreibung") should be also around 11 or 12px (like the article name "geschenkgutschein 25 eur" and not 'medium' as set in the user agent style sheet. but I cannot change the font size since the user agent stylesheet setting are not accessible to me when I inspect the element using chrome.

 

so how can I now get my font smaller again? read somewhere to put this

*{ margin:0; padding:0; }

in the global css but that is already there and does obviously not help:

 

phil

Edited March 1, 2013 by Pippo3000 (see edit history)

[PascalVG]

The description field, you can change in global.css:

Find and change:

td.cart_description a { text-decoration: none }

to:

td.cart_description a { text-decoration: none; font-size:11px; } // font-size up to you of course

 

To change all fonts in tables in one time, you can change:

 

table.std {

border-spacing: 0;

border-collapse: collapse;

font-size: 10px; // <-- add this...

width: 100%

}

 

Hope this is what you wanted, If not or you need additional changes, please elaborate.

 

Pascal.

[Pippo3000]

Pascal, merci. that goes in the right direction as I was able to adjust the size of the product items name itself. However, I want to adjust the header font size of that table (i.e. make the header font smaller). In chrome it refers to th.cart_product.first_item, th.cart_description.item and so on which I cannot find in my global CSS...

[Pippo3000]

To change all fonts in tables in one time, you can change:

 

table.std{

border-spacing: 0;

border-collapse: collapse;

font-size: 10px; // <-- add this...

width: 100%

}

 

Pascal, this one worked now, thanks. However, despite that the table width is still at 100% the table is actually NOT fully extended across the available space. What could now be the reason for this again. Sorry, I am not so much into programming; obviously :-)

 

See attached screen shots for settings and output (though output in German)

 

EDIT: realized that the width is adjusted depending on the length of the product description, so if I have a product with a longer description in the cart then indeed the table is 'streched' to max 100% which is OK. However, how can I make it a fixed 100% width?

Edited March 5, 2013 by Pippo3000 (see edit history)

[Pippo3000]

anybody?

[PascalVG]

Hi Phil,

Sorry for late reaction. I had a website off air for two days, because of problems at my host's server, which took endless communication. Getting back to normal now...

You can simply add the fixed width you need instead of the 100%. For example, you can write

width: 500px;

for a fixed width of 500 pixels. Of course, play a little with this number to see what width is beautiful in your case, but it gives you an idea.

 

Hope this fixes it. Otherwise let me know, and I try further...

 

Pascal

[Pippo3000]

Hope this fixes it. Otherwise let me know, and I try further...

 

Pascal

Merci, Pascal. This drives me crazy as these settings are not shown (with force compile and cache disabled), I mean I do the changes to e.g. 750px and the table width is not changed. what I realized is that usually the variables are light grey in notepad+ whereas the width setting is black. does that mean anything? see picture attached

 

phil

Edited March 11, 2013 by Pippo3000 (see edit history)