Resizing a header image in Material Design

When I drop a label in the “Drop title here” slot in the Material Design header, it seems to elongate for the text just fine.

However, I want an image there, and that just becomes a small box.

How can I make that bigger for an image?

This fits ok (label) :

.
.
And this is an image which I cannot expand any :

I’d suggest one of two things:

  1. Crafting an image of the correct size, then setting the display_mode of that Image component to original_size

  2. Dropping a FlowPanel into the title slot, then putting the Image inside it. This will allow you to adjust both height and width.

Ok, it’s just in the IDE that happens. It seems to expand when you run the project, though it is strangely offset compared to the label.

Ah, I tried it with a control panel, not a flow panel which does indeed work in both the IDE & the running app.

It’s still quite offset at runtime though. In the IDE :

.
.
Running :

Yeah, the spacing there is really set up for text. Try setting the spacing_above property to none - and if that’s not enough, try method #1 :slight_smile:

I would have put money on I tried #1, but clearly I didn’t as it does indeed, also work.
spacing_above didn’t help the runtime offset; I’ll play with the CSS to see what happens.

Cheers.

edit - now it’s perfectly aligned and not offset. I’m just going to put it down to magic…