cancel
Showing results for 
Search instead for 
Did you mean: 

htmlB button class...?

Former Member
0 Kudos

Hi, I'm studying htmlb buttons and I'm wondering why there is a difference between:

<b><hbj:button id="button" text="Go"/></b>

and

<b><input type="button" class="urBtnStd" value="Go"></b>

I checked the source of the iView that had the htmlB button, and saw that it used the urBtnStd class, so I used it using regular html. However, for some reason it doesn't look quite the same. I'm curious to see if there a way to make them identical?

Thanks so much,

Baggett.

Accepted Solutions (1)

Accepted Solutions (1)

Former Member
0 Kudos

Hi Baggett,

The difference is that by defining a class to your button you assign a .css style sheet definition to you button. This style sheet defines how the button looks like. So you can decorate your buttons to have different look and feel to fit your layout design.

Look at this webpage:

http://www.webmatze.de/webdesign/css/buttontricks.htm

To make your buttins identical use the same class or no class at all to your buttons.

Regards,

Ville

Message was edited by: Ville Leivo

Former Member
0 Kudos

Hi Ville, thanks for your response. However, in both cases, we are using the exact same class, why would it still look different? The button seems to be shorter and longer for the regular html version.

Thanks for your help,

Baggett

Former Member
0 Kudos

Hi Bagget,

hmm.. sounds a bit weird but there might be few reasons for that.

1. Are you sure both .jsp pages has the same .css style sheet file loaded into it?

2. Does the both buttons have the same text in them?

3. One more thing about your style sheet.. Have your style sheet a definition for inpt objects? Something like:

.input {

// definition here

}

Without seeing your code it's quite hard to tell but I'm pretty sure this kind of behavior is caused by different style sheet definitions..

Regards,

Ville

Message was edited by: Ville Leivo

Former Member
0 Kudos

Hi Ville, thanks for your response, this is the short code that I have:

<b><%@ taglib uri="tagLib" prefix="hbj" %>

<hbj:content id="myContext" >

<hbj:page title="Index Page">

<hbj:form id="myFormId">

<br>

<hbj:gridLayout width="100%" cellPadding="5">

<hbj:gridLayoutCell rowIndex="1" columnIndex="1" style="title" horizontalAlignment="LEFT">

<hbj:button id="button" text="Go to page" onClick="Go to page"/>

</hbj:gridLayoutCell>

<hbj:gridLayoutCell rowIndex="5" columnIndex="2" style="" horizontalAlignment="LEFT">

<input type="button" class="urBtnStd" ct="Button" style="white-space:nowrap;" value="Go to page">

</hbj:gridLayoutCell>

</hbj:gridLayout>

</hbj:form>

</hbj:page>

</hbj:content></b>

You could just copy and paste this code and check it out. Basically, I looked at the source of the htmlb from my browser and tried to use it's class for my regular html button.

Thanks so much,

Baggett

Former Member
0 Kudos

Hi Ville, I've found the problem, this htmlb "Button" is actually a link, so when I do something like:

<b><a href="javascript:void(0);" class="urBtnStd" id="htmlb_4307_htmlb_1628_1" ct="Button" style="white-space:nowrap;">Go to page</a></b>

It looks exactly the same, I had thought it was a regular html button

Thanks so much again Ville,

Baggett

Answers (0)