How do I adapt sizes for mobile?

Just an FYI, I managed to find the responsiveness button for some blocks, but I still can’t find a way to adapt images to look differently on mobile. This is my website above and I’m trying to adjust the logo on the first section for mobile.

Hey @dhikademocrat,

How do you want the logo to look on mobile devices? Do you want it to look smaller?

We can do that with some custom CSS, as that Image Block is a built-in WordPress block, and isn’t made by us.

Let me know how you want it to look on mobile devices and we will help you with the CSS.

Hi @hardeepasrani
You’re on point! I’d like to make it smaller indeed. As you may have known by now, I’m not a coder ?? But if you give me the custom CSS code and how to implement it, I can certainly get my way around.

Thanks again!

Try adding the following CSS to your image block and it should fix it:

@media screen and (max-width: 600px) {
	selector figure {
		width: 200px;
	}
}

Let me know if it works. ??

• This reply was modified 5 years, 9 months ago by Hardeep Asrani.

Yes this works! Thanks ??
Still in this topic, can you please let me know why the header of this page is messed up on mobile?

It goes beyond the right border on my mobile screen. I viewed it with Firefox and Brave.

Let me know how this goes for you as well and how I can fix this. I checked the responsiveness settings for mobile on the backend but still can’t figure out how to solve it.

@hardeepasrani any chance that you read my message above?

@dhikademocrat Can you make your website public so I could take a look?

Whoops sorry. I made it public now. The link is still the same as noted at the start of this thread.

Hey @dhikademocrat,

You need to use collapse option in Button Group block and make it collapse on Mobile devices: https://nimb.ws/yr16JM

Let me know if it works for you. Sorry for the delay. ??

Hi @hardeepasrani

Thanks so much for your help so far, it definitely works ??
Another question still around mobile responsiveness: when viewing this page https://ds-salon.co/daftar-harga/ on FireFox, it looks fine. But when viewing it with Chrome based browser like Brave or Chrome or Native Android browser, all content is dragged a bit to the right and cropped.

Could you please help me fix it? Thanks again and hope you enjoy your time in Europe.

Hey @dhikademocrat,

This seems weird. We’re taking a look at it to figure out why this behavior is happening. Please wait as I’m waiting for the Neve theme team to respond. Thank you! ??

Can you export that page and give it to us so we could try to reproduce it? We’re having issues trying to debug it on your side. @dhikademocrat

Hi @hardeepasrani thanks for responding! I’m not that much of a technical person so would you please instruct me how I can export the page and send it to you?

Thanks again for looking into this!

You can use this plugin to do it: https://www.ads-software.com/plugins/blocks-export-import/

Select all the blocks and export them. Let me know if that works. ??

Thanks for the instructions!
1. Can you see if this link works for you as a download link?

2. I’m not sure if I exported them right. Basically I just went into different sections and export them one by one. Let me know if I should export each specific block instead of just each section.

Much appreciated ??