Hi
By default, the expression theme isn’t the full width of the screen. I want to make it full-width so that it looks more professional, without the gaps to the right and left of the screen.
Can anyone help me code this?
Website is www.directsmilesofficial.com
TIA
I’m Richard Nguyen - CRO Expert at PageFly, I’d like to suggest this idea:
Add this css at the bottom
Online Store ->Theme ->Edit code
Assets → styles.css
.page-width {
width: unset !important;
max-width: unset !important;
margin: 0 !important;
}
.main-page-content {
padding-right: 0 !important;
padding-left: 0 !important;
}
Hope you find my answer helpful!
Regards,
Richard-pagefly
Thank you for your reply.
I tried the above but unfortunately, it isn’t working.
This is what I have:
@media screen and (max-width: 600px) {
.h2, h2 {
font-size: 20px !important;
}
}
@media only screen and (max-width: 559px) {
.row-double-space {
margin-top: 5px !important;
margin-bottom: 5px !important;}
@media only screen and (max-width: 749px) {
.mobile–device {
display: block !important;
}
.desktop–device {
display: none !important;
}
}
@media only screen and (min-width: 750px) {
.mobile–device {
display: none !important;
}
.desktop–device {
display: block !important;
}
.page-width {
width: unset !important;
max-width: unset !important;
margin: 0 !important;
}
.main-page-content {
padding-right: 0 !important;
padding-left: 0 !important;
}
Any help would be great. Thank you
Hi @O_directsmile you can try this code
I’m Richard Nguyen - CRO Expert at PageFly, I’d like to suggest this idea:
You can try with this code.
Follow this:
Go to Online Store->Theme->Edit code->theme.liquid->paste bellow code in tag
.page-width { width: unset !important; max-width: unset !important; margin: 0 !important; } .main-page-content { padding-right: 0 !important; padding-left: 0 !important; }Please refer to this screenshot:
Hope you find my answer helpful!
Best regards,
Richard | PageFly
Thank you for your reply. The coding worked however, the width of the whole page is too wide now. Do you know how I can reduce this slightly?
Kind regards
Hi @O_directsmile ,
I’m Richard Nguyen - CRO Expert at PageFly, I’d like to suggest this idea:
You can try with this code.
Follow this:
Go to Online Store->Theme->Edit code->theme.liquid->paste bellow code in tag
Please refer to this screenshot:
Hope you find my answer helpful!
Best regards,
Richard | PageFly