Archived topic
aligning a column to be full-width on mobile
5 replies · Started by Melissa on September 12, 2019
Hi,
On this page, I'm currently displaying 2 columns in the area below the top orange strip. They stack on mobile just as I want them to. But I'd like the second column to be full width on mobile (the image and the background color).
https://theslowroad.org/housesitting/
Can you help out? Thanks
Hi there,
Did you get this sorted? It looks great on mobile to me.
Let me know :)
No, haven't worked it out. What I want is for the photo and blue box to bleed to the screen edges.
Hi there.
you could try this:
.page2_row2_column2 {
width: 100vw;
margin-left: -30px !important;
}
Just add it inside your mobile media query. You may want to give that element a specific class to set this style.
Perfect. Do I do the same thing to stretch images edge-to-edge on mobile?
For mobile only wrap it like this:
@media (max-width: 768px) {
.page2_row2_column2 {
width: 100vw;
margin-left: -30px !important;
}
}