css mod to Mac bookmarks-toolbar
I had some css code that made the tiny bookmark/toolbar font bigger on a Mac..... it worked but I lost it.. what is it??? it was something like item-bookmark-toolbar "font 18,important" something like that....
Chosen solution
Hi Paul, I don't know what size would be ideal for you, but at least on mine, this is larger, but not too huge:
/* Set font size for Bookmarks Toolbar */
#PersonalToolbar {
font-size: 14px !important;
}
Here's a little background on how CSS rules work:
selector {
property: value;
}
The selector -- what the rule should be applied to -- usually is the trickiest part. The Bookmarks Toolbar outer container -- the bar -- has id="PersonalToolbar" and in CSS, you use the # character to indicate an id. Within the bar there are #personal-bookmarks and #PlacesToolbar and any of the three work for this purpose.
The property you care about is font-size and you can measure that in many ways, but pixels (px) is the most common for screen measurement purposes. So 14px means 14 pixels, and it's just slightly shy of the default size for text in web content, which is 16px.
Good luck in your experiments!
P.S. If you need a refresher on setting up a new userChrome.css file, check out the steps in this recent thread by analogy: https://support.mozilla.org/questions/1288218#answer-1315793
Read this answer in context 👍 0All Replies (6)
Seçilmiş Həll
Hi Paul, I don't know what size would be ideal for you, but at least on mine, this is larger, but not too huge:
/* Set font size for Bookmarks Toolbar */
#PersonalToolbar {
font-size: 14px !important;
}
Here's a little background on how CSS rules work:
selector {
property: value;
}
The selector -- what the rule should be applied to -- usually is the trickiest part. The Bookmarks Toolbar outer container -- the bar -- has id="PersonalToolbar" and in CSS, you use the # character to indicate an id. Within the bar there are #personal-bookmarks and #PlacesToolbar and any of the three work for this purpose.
The property you care about is font-size and you can measure that in many ways, but pixels (px) is the most common for screen measurement purposes. So 14px means 14 pixels, and it's just slightly shy of the default size for text in web content, which is 16px.
Good luck in your experiments!
P.S. If you need a refresher on setting up a new userChrome.css file, check out the steps in this recent thread by analogy: https://support.mozilla.org/questions/1288218#answer-1315793
that didnt work. I tried this one and it lso didnt work. /* Huge text on bookmarks toolbar */
- PlacesToolbarItems .bookmark-item {
font-size: 16px !important;
} can you see something wrong with the syntax...???? I made sure to go into about config and change the toolkit css changes thing to true.... and I saved everything and even restarted FF and Mac.
paul smith said
that didnt work. I tried this one and it lso didnt work.
/* Huge text on bookmarks toolbar */
#PlacesToolbarItems .bookmark-item {
font-size: 16px !important;
}
Were you starting from scratch with a new userChrome.css file? If not, was there anything above the new rule or did you paste it at the top?
yes new user file is correct.... no other code in there...I have run into this before whenever FF forces us into an update. Its AMAZING to me with all the people there that they cant write a small bit of code to do this in the settings...its come up hundreds of times over the years.... There was an add on for this and they made it obsolete. What is it going to take to get FF to make this easy????? Millions of people have Macs and the tiny bookmark font is stupid.Anyone can see that...
Well, we've had this approach for two and half years, and updates shouldn't affect your existing userChrome.css file. There's a built-in scaling preference for the entire browser, UI and content, so if everything is too small, the best thing to do is adjust that. But if you only want to modify one area, then userChrome.css is the best option.
Did you generate the file from my site? Usually that works. Hopefully it's not broken.
Make sure userChrome.css is a plain text file that doesn't have any rich text formatting code.
On Mac you can use the TextEdit utility to create the userChrome.css file as a plain text file.