This project has moved. For the latest updates, please go here.

How to change the images in the header

Dec 14, 2009 at 8:43 PM
Edited Dec 14, 2009 at 8:53 PM

I wanted to give some padding to the images in the header, by header I mean the top buttons.

The buttons are very close to each other and also they are small in size.

Any idea how can I change them. 

Dec 22, 2009 at 6:32 PM


One way I found to do this is to edit the jHtmlArea.css file.  Find the lines near the top (4th & 5th lines)

div.jHtmlArea .ToolBar ul { border: solid 1px #ccc; margin: 4px; padding: 1px; float: left; background: #fff url(jHtmlArea_Toolbar_Group_BG.png) repeat-x;}
div.jHtmlArea .ToolBar ul li { list-style-type: none; float: left; border: none; padding: 1px; margin: 1px; }

Changing the margin on the ul adds space between sections of buttons, changing the ul li modifies the actual buttons.

Hope this helps.