Jump to content
Pippo3000

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

Recommended Posts

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

post-111175-0-19368800-1362127551_thumb.jpg

post-111175-0-78417200-1362127558_thumb.jpg

Edited by Pippo3000 (see edit history)

Share this post


Link to post
Share on other sites

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.

Share this post


Link to post
Share on other sites

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...

Share this post


Link to post
Share on other sites

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?

post-111175-0-68162300-1362473337_thumb.png

post-111175-0-86827000-1362473343_thumb.png

Edited by Pippo3000 (see edit history)

Share this post


Link to post
Share on other sites

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

Share this post


Link to post
Share on other sites

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

post-111175-0-20505100-1362932765_thumb.jpg

Edited by Pippo3000 (see edit history)

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More