How can I make sections full width on mobile using the Dawn Theme?

Store Design
,
1

Is there a way to make all my sections full width on mobile?

For example, on the homepage I need the image+text blocks to occupy the full width of the screen. Check the attachments.
http://alata.

2

Hi,

Yes, it would be possible through custom coding. As a reference, you can start by using the below CSS code:

@media (max-width:768px) {
.page-width {
  width: 100% !important;
  padding: 0 !important;
  max-width: 100% !important;
}
}

Adding it at the end of your base.css file would make the elements full width, on mobile phones.

Cheers!

3

@zohia

This site can’t be reached

4

Thank you so much for your help.

Can you help me apply it to only some of the sections?

It would be only to the image+text sections. The header, slideshow and featured products should stay the same.

Thanks!

5

Thanks, Gabriel.

Is there any way we can make this code apply only to image+text sections?

6

Hi @zohia
You can try to add this code into the bottom of the file base.css

.image-with-text{
padding-left: 0;
padding-right: 0;
}
7

Brilliant, thanks!

8

Hi, is there a way to apply this to ONLY the featured products? (For mobile view on Dawn) Many thanks