How can I increase the width of the scrollbar in FireFox ?
-
- Posts: 5
- Joined: November 21st, 2005, 5:47 am
How can I increase the width of the scrollbar in FireFox ?
The scrollbar in my FireFox is so narrow it's tough to grab. Is there an easy setting I can add to one of the config files to set the width wider ?
-
- Posts: 470
- Joined: October 1st, 2004, 9:13 pm
- Location: Sunny California
Paste this code in userContent.css and adjust the sizes
Code: Select all
/* Change width of VERTICAL SCROLLBAR */
scrollbar[orient="vertical"], scrollbar[orient="vertical"] thumb, scrollbar[orient="vertical"] scrollbarbutton { max-width: 15px !important; -moz-appearance: none !important; }
/* Change width of HORIZONTAL SCROLLBAR */
scrollbar[orient="horizontal"], scrollbar[orient="horizontal"] thumb, scrollbar[orient="horizontal"] scrollbarbutton { max-height: 15px !important; -moz-appearance: none !important; }
-
- Posts: 5
- Joined: November 21st, 2005, 5:47 am
- Monimonika
- Posts: 1067
- Joined: July 27th, 2005, 12:49 pm
Did you close Firefox before doing the pasting? Did you go to the .css files in your profile folder (not the one in the program folder)?
http://kb.mozillazine.org/Profile_folde ... _folder.3F
http://kb.mozillazine.org/Profile_folde ... _folder.3F
-
- Posts: 5
- Joined: November 21st, 2005, 5:47 am
I just checked the file. Mine is located at
C:\Documents and Settings\Kent\Application Data\Mozilla\Firefox\Profiles\32hr4kz8.default\chrome\UserContent.css
Currently, that file contains:
marquee {
-moz-binding: none;
}
/* Change width of VERTICAL SCROLLBAR */
scrollbar[orient="vertical"], scrollbar[orient="vertical"] thumb, scrollbar[orient="vertical"] scrollbarbutton { max-width: 60px !important; -moz-appearance: none !important; }
/* Change width of HORIZONTAL SCROLLBAR */
scrollbar[orient="horizontal"], scrollbar[orient="horizontal"] thumb, scrollbar[orient="horizontal"] scrollbarbutton { max-height: 60px !important; -moz-appearance: none !important; }
I don't what it is or how that Marquee thing got in there but it was already there so I pasted your stuff after it. I have verified it's there.
I have even restarted my computer and restarted FireFox but there is no change.
Should perhaps I be entering { min-width: 60px ... ?
C:\Documents and Settings\Kent\Application Data\Mozilla\Firefox\Profiles\32hr4kz8.default\chrome\UserContent.css
Currently, that file contains:
marquee {
-moz-binding: none;
}
/* Change width of VERTICAL SCROLLBAR */
scrollbar[orient="vertical"], scrollbar[orient="vertical"] thumb, scrollbar[orient="vertical"] scrollbarbutton { max-width: 60px !important; -moz-appearance: none !important; }
/* Change width of HORIZONTAL SCROLLBAR */
scrollbar[orient="horizontal"], scrollbar[orient="horizontal"] thumb, scrollbar[orient="horizontal"] scrollbarbutton { max-height: 60px !important; -moz-appearance: none !important; }
I don't what it is or how that Marquee thing got in there but it was already there so I pasted your stuff after it. I have verified it's there.
I have even restarted my computer and restarted FireFox but there is no change.
Should perhaps I be entering { min-width: 60px ... ?
- dickvl
- Posts: 54163
- Joined: July 18th, 2005, 3:25 am
You want to incease the default so you must use min-width and min-heigthtnek wrote:I pasted those into my userContent.css changed { max-width: 60px ....} . When I restarted FireFox nothing had changed.
Is there any other switch or something I need to change ? Any setting that might be over riding this ?
I even tried pasting it into UserChrome.css to no avail.
Code: Select all
/* Increase width of VERTICAL SCROLLBAR */
scrollbar[orient="vertical"], scrollbar[orient="vertical"] thumb, scrollbar[orient="vertical"] scrollbarbutton { min-width: 35px !important; -moz-appearance: none !important; }
/* Increase width of HORIZONTAL SCROLLBAR */
scrollbar[orient="horizontal"], scrollbar[orient="horizontal"] thumb, scrollbar[orient="horizontal"] scrollbarbutton { min-height: 35px !important; -moz-appearance: none !important; }
You can try without the -moz-appearance: none !important; to see what you like best.
You can put the same code in userChrome.css to make it work in chrome windows too (e.g. Extensions Manager)
- dickvl
- Posts: 54163
- Joined: July 18th, 2005, 3:25 am
Does anybody know why deceasing the scroll bar width in Fx 1.5 and 1.5.0.1 does work (userContent.css): the slider and thumbs are smaller, but the track doesn't change width? (works in Fx 1.0.7 and trunk versions).
I see nothing in the 'classic.jar\skin\classic\global\xulscrollbars.css' file indicating this.
Could it be caused by scrollcorner { background:url("chrome://global/skin/scrollbar/corner.png") no-repeat;}
not being resized.
I always work full screen with autohide extension and don't want the vertical scroll to take much space (causes appearance of a horizontal scroll bar sometimes) and I put the mouse cursor to the far right of the screen to operate the scrollbar.
I see nothing in the 'classic.jar\skin\classic\global\xulscrollbars.css' file indicating this.
Could it be caused by scrollcorner { background:url("chrome://global/skin/scrollbar/corner.png") no-repeat;}
not being resized.
I always work full screen with autohide extension and don't want the vertical scroll to take much space (causes appearance of a horizontal scroll bar sometimes) and I put the mouse cursor to the far right of the screen to operate the scrollbar.
Last edited by dickvl on February 16th, 2006, 5:27 pm, edited 3 times in total.
- Kupfel
- Posts: 416
- Joined: December 18th, 2005, 10:03 pm
well, you cant expect it to look good if you widen the scrollbar with css code..
if you are so depending on using scrollbars (no scrollwheel? on a tablet pc?) then you could try scrollbar anywhere:
http://www.extensionsmirror.nl/index.php?showtopic=194
which lets you scroll anywhere on the page, or grab and drag:
http://www.extensionsmirror.nl/index.php?showtopic=4349
which lets you scroll by dragging the page acrobat-style
if you are so depending on using scrollbars (no scrollwheel? on a tablet pc?) then you could try scrollbar anywhere:
http://www.extensionsmirror.nl/index.php?showtopic=194
which lets you scroll anywhere on the page, or grab and drag:
http://www.extensionsmirror.nl/index.php?showtopic=4349
which lets you scroll by dragging the page acrobat-style
-
- Posts: 1510
- Joined: May 8th, 2004, 1:38 pm
@dickvl: Thank you for fixing that in a hurry - I'm using it as of 15 seconds ago. Excellent! First ones above no workie, at least for me. Cheers. I'll play with measurements.
I have a question since you da scrollbar man! What is the "grippie/gripper/slider button CALLED and why can't I seem to change its color from the default drab? I've done the background but can't find "code word" for the actual thing you drag.
I have a question since you da scrollbar man! What is the "grippie/gripper/slider button CALLED and why can't I seem to change its color from the default drab? I've done the background but can't find "code word" for the actual thing you drag.
PentiumIII/W2K, Toshiba AMD laptop/Vista. FX 3 on both.
- dickvl
- Posts: 54163
- Joined: July 18th, 2005, 3:25 am
This is the code of the scroolbar:So to change the slider how have to replace 'slider.gif'
Code: Select all
/* ::::: scrollbar ::::: */
scrollbar {
-moz-appearance: scrollbartrack-horizontal;
-moz-binding: url("chrome://global/content/bindings/scrollbar.xml#scrollbar");
cursor: default;
background: url("chrome://global/skin/scrollbar/slider.gif") scrollbar;
}
-
- Posts: 1510
- Joined: May 8th, 2004, 1:38 pm
I'm diggin' this! Just noticed that I had scrollbar COLOR stylish script transferred to userChrome, but it has to go in userContent AND userChrome, or you get it sometimes and not others (like this forum). I'll play with this new thing above/GIF image - used it before but replace with rgb(xxx,xxx,xxx) and it works fine.
So far,
scrollbar {
-moz-appearance: scrollbartrack-horizontal;
-moz-binding: url("chrome://global/content/bindings/scrollbar.xml#scrollbar");
cursor: default;
background: url("chrome://global/skin/scrollbar/CC33FF") scrollbar;
}
isn't doing it, but I'll work on it. Cheers and thank you Sir.
So far,
scrollbar {
-moz-appearance: scrollbartrack-horizontal;
-moz-binding: url("chrome://global/content/bindings/scrollbar.xml#scrollbar");
cursor: default;
background: url("chrome://global/skin/scrollbar/CC33FF") scrollbar;
}
isn't doing it, but I'll work on it. Cheers and thank you Sir.
PentiumIII/W2K, Toshiba AMD laptop/Vista. FX 3 on both.