Friday, September 20, 2013

How to apply css at in HorizontalPanel?

Hi,


I want to make center align element in horizontal panel. Look below code. It does what I want.

HorizontalPanel hp = new HorizontalPanel();
Image attachmentImg = new Image(GWT.getModuleBaseURL()
+ "/images/attachment.png");
attachmentImg.setTitle("Attach files");
hp.setWidth("100%");
hp.setHorizontalAlignment(HasAlignment.ALIGN_CENTER);
hp.add(attachmentImg);

As I find strange behaviour in one app. "Image" is still coming left align. 
When I see in firebug, it appy the css which is for common to project.
.block table tr td, .block table tr th {
    line-height: normal;
    text-align: left; //It make align left element
}

I created new css to make !important align property like 
.center-alignment
{
 text-align:center !important;  
}
And assign to hp like

 hp.setStylePrimaryName("center-alignment");

Still coming left align image and generate html in firebug like

<table class="center-alignment" cellspacing="0" cellpadding="0" style="width: 154px;">
<tbody>
<tr>
<td align="center" style="vertical-align: top;"> <!---I want to apply this css here  but don't know how?-->
<img class="gwt-Image" src="url" title="Attach files">
</td>
</tr>
</tbody>
</table

I want to apply it on <td> level.   I am really stuck here what should I do. I can not remove that block css as I don't know impact of it.  As app is very large. If I solve issue here,  It may create other place new issue.

--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscribe@googlegroups.com.
To post to this group, send email to google-web-toolkit@googlegroups.com.
Visit this group at http://groups.google.com/group/google-web-toolkit.
For more options, visit https://groups.google.com/groups/opt_out.

No comments:

Post a Comment