Support #4830

Can anyone help me resize images?

Added by Matt Picas over 6 years ago. Updated over 6 years ago.

Target version:
Start date:
Due date:
% Done:


Estimated time:


Hi Everyone, I finally got Wt working but am having trouble resizing the images to fit the browser. I want to use 4 images across the screen at 448x280 pixels each and it looks great on a 1920x1080p monitor in full screen on a browser, but everything else it is displaying badly with the pictures out of place (If I reduce the browser size it does this.) I found this video on how to resize images in CSS ( and tried to edit the dragdrop.CSS file for the dragdrop example to resize the images that I added to this container:

DragExample::DragExample(WContainerWidget *parent):


Here is an example of one of the images I added to that container:

WImage *MyTestPic = new WImage(WLink("icons/MyTestPic.jpg"), this);

MyTestPic->setMargin(5, Left);

So that loaded the image onto the page so to try to fix the resizing I went into the CSS and added the following line of code for that image (and each of the other ones):

.MyTestPic {

max-width: 90%;

max-height: 90%


I was hoping it would work and recognize my MyTestPic WImage widget and fix it like it did in the guys video but it didn't. Can anyone help me? I'd be very grateful and appreciate it so much!


Updated by Koen Deforche over 6 years ago

  • Status changed from New to Feedback

You're missing a 'MyTestPic->setStyleClass("MyTestPic")' call?


Updated by Matt Picas over 6 years ago

Thanks for the reply Koen! I tried that and using the CSS code but it's still not resizing from the CSS. (I was able to get other things to work like the example for yellow and blue box in widgetgallery's layout manager example). I'm not sure how I can get my images to work on mobile and other resolutions if I don't find the solution so it's really important to figure out how to get them to resize! Thanks again for the response, do you know what else could be wrong?

Also available in: Atom PDF