Re: cannot use css background-image
Did you find a solution to this?
I dunno how background images behave with HorizontalPanels. My guess is
not well given that HorizontalPanels are cell panels--they use HTML
tables, not divs--and are not recommended for standards mode
(https://developers.google.com/web-toolkit/doc/latest/DevGuideUiPanels#Standards).
That said, I have used background images in AbsolutePanels with both
UiBuilder via sprites and plain GWT and CSS.
On Monday, April 2, 2012 2:36:48 AM UTC-4, tong123123 wrote:
even worse, if I comment the line
outer.setBorderWidth(10);
then left2 cannot show at all!!
On Monday, April 2, 2012 2:11:51 PM UTC+8, tong123123 wrote:
yes, I miss the opening quote '
and I find in css, if using development mode, the url has a / at the
beginning
background-image:url('/images/line.png');
but if in production mode, the url has no / at the beginning
background-image:url('images/line.png');
the reason is really unknown.
But now I face another strange problem, the code is as follow:
public class TestFlowPanelLeft extends FlowPanel {
public void onLoad(){
HorizontalPanel outer = new HorizontalPanel();
outer.setSize(100%, 30px);
outer.setBorderWidth(10);
HorizontalPanel left1 = new HorizontalPanel();
left1.add(new Label(see?));
outer.add(left1);
HorizontalPanel left2 = new HorizontalPanel();
left2.addStyleName(backGroundImage1);
//left2.setSize(100%, 100%); cannot show left2!!
left2.setSize(100%, 10px);
outer.add(left2);
this.add(outer);
}
}
I try to set left2 height to 100%, and because outer is 30px, so I expect
left2 can show correctly, but the result is not!!
I need to explicit set the height of left2.
the css of backGroundImage1 is
.backGroundImage1{
background-image:url('/images/line.png');
background-repeat:repeat-x;
}
if I set the height of left2 to 10px, the output is as attached.
why if I set the height of left2 to 100%, left2 cannot be shown?!!
--
You received this message because you are subscribed to the Google Groups
Google Web Toolkit group.
To view this discussion on the web visit
https://groups.google.com/d/msg/google-web-toolkit/-/HKQKFC7-4MoJ.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to
google-web-toolkit+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-web-toolkit?hl=en.
Re: cannot use css background-image
yes, I miss the opening quote '
and I find in css, if using development mode, the url has a / at the
beginning
background-image:url('/images/line.png');
but if in production mode, the url has no / at the beginning
background-image:url('images/line.png');
the reason is really unknown.
But now I face another strange problem, the code is as follow:
public class TestFlowPanelLeft extends FlowPanel {
public void onLoad(){
HorizontalPanel outer = new HorizontalPanel();
outer.setSize(100%, 30px);
outer.setBorderWidth(10);
HorizontalPanel left1 = new HorizontalPanel();
left1.add(new Label(see?));
outer.add(left1);
HorizontalPanel left2 = new HorizontalPanel();
left2.addStyleName(backGroundImage1);
//left2.setSize(100%, 100%); cannot show left2!!
left2.setSize(100%, 10px);
outer.add(left2);
this.add(outer);
}
}
I try to set left2 height to 100%, and because outer is 30px, so I expect
left2 can show correctly, but the result is not!!
I need to explicit set the height of left2.
the css of backGroundImage1 is
.backGroundImage1{
background-image:url('/images/line.png');
background-repeat:repeat-x;
}
if I set the height of left2 to 10px, the output is as attached.
why if I set the height of left2 to 100%, left2 cannot be shown?!!
--
You received this message because you are subscribed to the Google Groups
Google Web Toolkit group.
To view this discussion on the web visit
https://groups.google.com/d/msg/google-web-toolkit/-/5B-bLd_PsHcJ.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to
google-web-toolkit+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-web-toolkit?hl=en.
attachment: layoutproblem2.jpg
Re: cannot use css background-image
even worse, if I comment the line
outer.setBorderWidth(10);
then left2 cannot show at all!!
On Monday, April 2, 2012 2:11:51 PM UTC+8, tong123123 wrote:
yes, I miss the opening quote '
and I find in css, if using development mode, the url has a / at the
beginning
background-image:url('/images/line.png');
but if in production mode, the url has no / at the beginning
background-image:url('images/line.png');
the reason is really unknown.
But now I face another strange problem, the code is as follow:
public class TestFlowPanelLeft extends FlowPanel {
public void onLoad(){
HorizontalPanel outer = new HorizontalPanel();
outer.setSize(100%, 30px);
outer.setBorderWidth(10);
HorizontalPanel left1 = new HorizontalPanel();
left1.add(new Label(see?));
outer.add(left1);
HorizontalPanel left2 = new HorizontalPanel();
left2.addStyleName(backGroundImage1);
//left2.setSize(100%, 100%); cannot show left2!!
left2.setSize(100%, 10px);
outer.add(left2);
this.add(outer);
}
}
I try to set left2 height to 100%, and because outer is 30px, so I expect
left2 can show correctly, but the result is not!!
I need to explicit set the height of left2.
the css of backGroundImage1 is
.backGroundImage1{
background-image:url('/images/line.png');
background-repeat:repeat-x;
}
if I set the height of left2 to 10px, the output is as attached.
why if I set the height of left2 to 100%, left2 cannot be shown?!!
--
You received this message because you are subscribed to the Google Groups
Google Web Toolkit group.
To view this discussion on the web visit
https://groups.google.com/d/msg/google-web-toolkit/-/huxhL7vpG7oJ.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to
google-web-toolkit+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-web-toolkit?hl=en.
Re: cannot use css background-image
tong,
Perhaps that stray unclosed quote is causing an issue?
.backGroundImage1{
background-image:url(images/line.png*'*);
background-repeat:repeat-x;
}
Sincerely,
Joe
--
You received this message because you are subscribed to the Google Groups
Google Web Toolkit group.
To view this discussion on the web visit
https://groups.google.com/d/msg/google-web-toolkit/-/4rGSo3KPhX4J.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to
google-web-toolkit+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-web-toolkit?hl=en.
Re: cannot use css background-image
Or maybe a missing / at the beginning of the URL in your CSS (compared to
the URL you have used in your java code).
-- J.
Am Freitag, 30. März 2012 18:18:49 UTC+2 schrieb Joseph Lust:
tong,
Perhaps that stray unclosed quote is causing an issue?
.backGroundImage1{
background-image:url(images/line.png*'*);
background-repeat:repeat-x;
}
Sincerely,
Joe
--
You received this message because you are subscribed to the Google Groups
Google Web Toolkit group.
To view this discussion on the web visit
https://groups.google.com/d/msg/google-web-toolkit/-/29CxLhJf7N4J.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to
google-web-toolkit+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-web-toolkit?hl=en.
Re: cannot use css background-image
First, the path images/XX.png is completely different with
/images/XX.png. So verify your css file's path and his relative path to
the folder images
Then you should add a *'* before images/line.png. Means it should
like this : background-image:url(*'*images/line.png'); or don not use *'*,
like this : background-image:url(images/line.png);
Hope helpful...
Le vendredi 30 mars 2012 11:38:53 UTC+2, tong123123 a écrit :
the css is simple
.backGroundImage1{
background-image:url(images/line.png');
background-repeat:repeat-x;
}
the gwt code is
public class TestFlowPanelLeft extends FlowPanel {
public void onLoad(){
Image image1 = new Image();
image1.setUrl(/images/smallImg1.JPG);
image1.setSize(100px, 100px);
image1.setStyleName(floatLeft);
FlowPanel flowPanel1 = new FlowPanel();
flowPanel1.add(image1);
this.add(flowPanel1);
HorizontalPanel line1 = new HorizontalPanel();
line1.addStyleName(backGroundImage1);
line1.setWidth(200px);
this.add(line1);
}
}
the image1 can be shown, so it proof the path /images/XX.png is correct,
but the backGroundImage1 cannot be shown, what is the reason?
also, I cannot use ImageBundle and already give up after several try, so I
still prefer to use this method.
I try to use background image because I want to do something like
Title1
abc
def
Title2
fbg
the cannot be hardcode use -- because when the browser
window minimize, the line will broken to two line, so I want to use image
of line and set its width to 100% of a horizontalpanel, in fact, is this
method feasible?
--
You received this message because you are subscribed to the Google Groups
Google Web Toolkit group.
To view this discussion on the web visit
https://groups.google.com/d/msg/google-web-toolkit/-/pY78z4WLq4kJ.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to
google-web-toolkit+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-web-toolkit?hl=en.
