Problem With CSS for Various Components

Hi All,

I am trying desperately to style/fix the display of components.

As you will see in the attached image, the button has a strange line below it that I cannot get rid of. Anybody know how to get rid of the line. I have no styling for the button in the CSS.

For the textbox with the “Result” text, I would like that in middle (vertically) of the texrtbox. I have tried vertical-align, but that does not work.

.v-textarea, .v_textfield {
    resize: none;
    overflow: hidden !important;
    vertical-align: middle;

Finally, I am trying to get rid of the underline on the link. I am using:

.v-button-link .v-button-caption, .v-nativebutton-link .v-nativebutton-caption {
    text-decoration: none !important;

.v-link .v-link-over .v-captiontext {
    text-decoration: none !important;

Neither of these work.

I know that I don’t have a full grasp of CSS, but this appears to me to be pretty straight forward.

Any help would be greatly appreciated.


Button does not support a custom height, the line comes from the button background sprite coming through. try setting the button height to undefined.

Try adjusting the line-height CSS property to some good value.

How about:

.v-link span{ text-decoration:none; }

Or to be more precise, the “reindeer” theme does not support arbitrary heights for Button components. You can use another theme that does or use a NativeButton or customize the theme for your button yourself (non-trivial and requires new bitmaps etc, some pointers in other forum posts by Jouni Koivuviita).

Thanks for your help and clarification. The suggestions worked.