Title: Change toolbar size Last modified: August 21, 2016 --- # Change toolbar size * Resolved [Jamie.](https://wordpress.org/support/users/jamie-1/) * (@jamie-1) * [12 years, 5 months ago](https://wordpress.org/support/topic/change-toolbar-size/) * Hi, * I’m currently creating a wordpress site for a local charity organisation which will be used frequently by people with disabilities, as such accessibility features are a must. Whilst this plugin is good, I wondered if it would be possible to enlarge the toolbar icons for resizing text and such. I tried downloading the sprite.png, resizing and re-uploading, but that hasn’t helped too much. * Any help would be appreciated. Thanks. [Website](http://test-webzite.co.uk/keighleypeoplefirst/) * [http://wordpress.org/plugins/wp-accessibility/](http://wordpress.org/plugins/wp-accessibility/) Viewing 6 replies - 1 through 6 (of 6 total) * Thread Starter [Jamie.](https://wordpress.org/support/users/jamie-1/) * (@jamie-1) * [12 years, 5 months ago](https://wordpress.org/support/topic/change-toolbar-size/#post-4390729) * I’ve managed to resize the box the image is in now, and created some new icons to display, though the first image repeats in all 3 boxes? * Plugin Author [Joe Dolson](https://wordpress.org/support/users/joedolson/) * (@joedolson) * [12 years, 5 months ago](https://wordpress.org/support/topic/change-toolbar-size/#post-4390735) * Doesn’t look like you’re using WP Accessibility anymore, so I guess there’s nothing I can say for this. Best of luck. * Thread Starter [Jamie.](https://wordpress.org/support/users/jamie-1/) * (@jamie-1) * [12 years, 5 months ago](https://wordpress.org/support/topic/change-toolbar-size/#post-4390747) * I am. Perhaps you caught me at a time where I either uninstalled and reinstalled to reset it for the moment, since I had to speak to my client, or when I was browsing for alternative solutions. (only thing that came close was ATbar and that’s pretty broken at least on my site). Regardless of whether or not you’l still help me, I’ll be keeping the plugin. * Many Thanks. * Plugin Author [Joe Dolson](https://wordpress.org/support/users/joedolson/) * (@joedolson) * [12 years, 5 months ago](https://wordpress.org/support/topic/change-toolbar-size/#post-4390756) * I see it again now – it must have been a timing thing. It looks, right now, like you’ve reset the styles back to the default; is that right? * Do you still have the styles you’d modified it to as of yesterday – it would be easier for me to give advice based on those. * You’re on the right track – you need to change the size of the icons and edit the CSS to increase the size of the toolbar, but I’m not sure what would be causing the image repeat effect that you described. * Thread Starter [Jamie.](https://wordpress.org/support/users/jamie-1/) * (@jamie-1) * [12 years, 5 months ago](https://wordpress.org/support/topic/change-toolbar-size/#post-4390757) * ``` /* Accessibility styles chris@inathought.com */ .focusable:focus { outline: none !important; } .has-focus { background: yellow; } fieldset fieldset { margin: 0 0 16px 0; } fieldset fieldset legend { border-bottom: none !important; font-size: inherit; margin: 0 !important; } fieldset p { font-size: inherit !important; line-height: 1.3 !important; } .a11y-toolbar { position: fixed; z-index: 99999; top: 43%; left: 0; } .a11y-toolbar ul { list-style: none; margin: 0; padding: 0; /* box-shadow: 0 0 3px #888; */ border-top-right-radius: 4px; border-bottom-right-radius: 4px; } .a11y-toolbar ul li { display: block; height: 80px; width: 80px; } .a11y-toolbar .icon { display: inline-block; background: url('../img/sprite.png') transparent no-repeat; height: 80px; width: 80px; margin-top: 3px; } .a11y-toolbar .icon-adjust { background-position: 0 0; } .a11y-toolbar .icon-tint { background-position: 0 -16px; } .a11y-toolbar .icon-font { background-position: 0 -32px; } .a11y-toolbar .icon-white.icon-adjust { background-position: -16px -16px; } .a11y-toolbar .icon-white.icon-tint { background-position: -16px 0; } .a11y-toolbar .icon-white.icon-font { background-position: -16px -32px; } .a11y-toolbar ul li a { display: block; height: 80px; width: 80px; background: #e2e2e2; text-align: center; line-height: 24px; border-top: 1px solid #f5f5f5; border-bottom: 1px solid #d2d2d2; } .a11y-toolbar ul li a:hover { background: #0066cc; } .a11y-toolbar ul li a.active { background: #0066cc; } .a11y-toolbar ul li:first-child a { border-top-right-radius: 4px; } .a11y-toolbar ul li:last-child a { border-bottom-right-radius: 4px; } .a11y-toolbar .offscreen, .a11y_stylesheet_path { position: absolute; left: -999em; } .desaturated { filter: grayscale(100%)!important; -webkit-filter: grayscale(100%)!important; -webkit-filter: grayscale(1)!important; -moz-filter: grayscale(100%)!important; -ms-filter: grayscale(100%)!important; -o-filter: grayscale(100%)!important; filter: gray!important; } .fontsize, .fontsize h1, .fontsize h2, .fontsize h3, .fontsize h4 , .fontsize h5, .fontsize h6, .fontsize p, .fontsize li, .fontsize label, .fontsize input, .fontsize select, .fontsize textarea, .fontsize legend, .fontsize code, .fontsize pre , .fontsize dd, .fontsize dt, .fontsize blockquote { font-size: 125% !important; line-height: 1.4; } .fontsize li li { font-size: 110% !important; } .fontsize .a11y-toolbar ul li { line-height: 20px !important; font-size: 75% !important; } .fontsize .a11y-toolbar ul li a { line-height: 24px !important; } ``` * as you can see, all I’ve changed in the code is all the size 24 to 24’s to 80 ×80 Then just uploaded the new image to replace the old ones which can be found [here.](http://i.imgur.com/xPLq2sB.png) * sorry for being a nuisance, I have very little coding knowledge. * I unfortunately won’t be able to upload this stylesheet for you to view until tomorrow. * Plugin Author [Joe Dolson](https://wordpress.org/support/users/joedolson/) * (@joedolson) * [12 years, 5 months ago](https://wordpress.org/support/topic/change-toolbar-size/#post-4390759) * You’ll need to adjust the background-position numbers proportionately with your increase in size for the icons. The background-position indicates where a given image will be shown. * This may take a bit of tweaking, but it shouldn’t take too long, even using trial and error. Viewing 6 replies - 1 through 6 (of 6 total) The topic ‘Change toolbar size’ is closed to new replies. * ![](https://ps.w.org/wp-accessibility/assets/icon-256x256.png?rev=1097582) * [WP Accessibility](https://wordpress.org/plugins/wp-accessibility/) * [Frequently Asked Questions](https://wordpress.org/plugins/wp-accessibility/#faq) * [Support Threads](https://wordpress.org/support/plugin/wp-accessibility/) * [Active Topics](https://wordpress.org/support/plugin/wp-accessibility/active/) * [Unresolved Topics](https://wordpress.org/support/plugin/wp-accessibility/unresolved/) * [Reviews](https://wordpress.org/support/plugin/wp-accessibility/reviews/) * 6 replies * 2 participants * Last reply from: [Joe Dolson](https://wordpress.org/support/users/joedolson/) * Last activity: [12 years, 5 months ago](https://wordpress.org/support/topic/change-toolbar-size/#post-4390759) * Status: resolved