AAAAAAAAAAHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHH
F***CKING GIF images.... sorry. It cost me over two hours to find out that the jboss cvs
serves gif images as ascii so they (save, cancel, ok, transition) all are corrupted.
Therefor I did not see them in my webapp before. Altough my eclipse client is configured
to store them as binary, they still come in as ascii even when I tried to re-get them....
I now have buttons which are fully stylable with css, rounded corners in ff (opera and
safari will follow), but not IE, dynamic width, you can hover over them, 'press'
them, they have an image on them (configurable via css), a disabled style and NO
javascript at all, no hasseling with fonts etc...
They still need some tweeking (id and class thing) , the correct images (can someone try
to check them in as binary? and the correct colors.. and then wrapped in a tag... The html
required is the following:
<a href="#" class="button" id="buttonCancel"
title="Clicking this button won?t validate anything"><span
class="icon">Ok</span></a>
| <p><a href="#" class="buttonDis"
id="buttonSave" title="This button is disabled"><span
class="icon"Save"</span></a></p>
css:
| /* button styles */
| a.button,a.buttonDis {
| display: inline;
| height: 28px;
| margin: 6px auto;
| padding: 4px 16px 4px 16px;
| text-align: center;
| font-size: 100%;
| font-weight: bold;
| text-decoration: none;
| font-family: Arial, Helvetica, sans-serif;
| cursor: pointer;
| border-top: 2px solid #FFAAAA;
| border-left: 2px solid #FFAAAA;
| border-right: 2px solid #CCAAAA;
| border-bottom: 2px solid #CCAAAA;
| -moz-border-radius: 7px 7px 7px 7px;;
| background-color: #D0D0D0;
| }
|
| a.button:link,a.button:visited {
| color: #002577;
| }
|
| a.button:hover {
| background-color: #E0E0E0;
| color: #FF7200;
| }
|
|
| a.button:active {
| background-color: #C0C0C0;
| color: #F76D00;
| border-top: 2px solid #997777;
| border-left: 2px solid #997777;
| border-right: 2px solid #CCAAAA;
| border-bottom: 2px solid #CCAAAA;
| }
|
|
| a.buttonDis:link,a.buttonDis:visited,a.buttonDis:hover,a.buttonDis:active
| {
| background-color: #8F8F8F;
| color: #5F5F5F;
| cursor: default;
| }
|
| .icon {
| position: relative;
| top: 0px;
| left: 0px;
| background-repeat: no-repeat;
| padding: 0px 0px 5px 18px;
| }
|
| a.button:hover .icon {
| }
|
| a.button:active .icon {
| top: 1px;
| left: 1px;
| }
|
| a.buttonDis:link .icon,a.buttonDis:visited .icon,a.buttonDis:hover
.icon,a.buttonDis:active .icon
| {
|
| }
|
| /* list of button icons */
| #buttonOK .icon {
| background-image: url("../images/ok.gif");
| }
|
| #buttonCancel .icon {
| background-image: url("../images/cancel.gif");
| }
|
| #buttonSave .icon {
| background-image: url("images/save.gif");
| }
|
There seems to be some redundant/empty style info in here, but that can be used to do some
other things if wanted by someone
View the original post :
http://www.jboss.com/index.html?module=bb&op=viewtopic&p=3996557#...
Reply to the post :
http://www.jboss.com/index.html?module=bb&op=posting&mode=reply&a...