Image container not full width of page

Solved
jacauschi23
Explorer
60 9 17

On the Lookbook page I have images shown in 2 columns. Right now they're at 50% width because anything more and it puts them all in one single column. 

How can I get this 2-column setup to take up the full page container width? Just like how the video on the home page does.

TEST SITE: https://doja-exclusives.myshopify.com/pages/lookbook

PW: aobrew

dmwwebartisan
Shopify Partner
5642 1289 1647

@jacauschi23 

Please add the following code at the bottom of your assets/theme.css file.

@media screen and (min-width: 1280px){
#lookbook .page-content{ width: 100% important; }
}

 

Hope this works.

Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
jacauschi23
Explorer
60 9 17

@dmwwebartisan unfortunately that didn't do anything

dmwwebartisan
Shopify Partner
5642 1289 1647

@jacauschi23 

Please add the following code at the bottom of your assets/theme.css file.

@media screen and (min-width: 1280px){
body#lookbook .page-content { width:100%; }
}

Let me know if this works.

Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
jacauschi23
Explorer
60 9 17

@dmwwebartisan still not working. I placed the code into the bottom of assets/theme.css file. and then increased the width past 50% on the content editor of the page but it still makes them all go into just one column. This what I have as the CSS in the content editor of that page, anything past 50% and it puts them in 1 column. 

<style><!--
* {
  box-sizing: border-box;
}

.column {
  float: left;
  width: 50%;
  padding: 5px 10px 5px 10px;
}

/* Clearfix (clear floats) */
.row::after {
  content: "";
  clear: both;
  display: table;
}
--></style>

 

0 Likes
dmwwebartisan
Shopify Partner
5642 1289 1647

@jacauschi23 

I just checked your page. It looks fine and the images are in full width. 

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
jacauschi23
Explorer
60 9 17

@dmwwebartisan  No thats how it has looked the whole time. They're at 50% width right now because any bigger and they automatically all go into one column instead of staying in two. I need the images to be bigger while retaining the 2 columns. 

0 Likes
dmwwebartisan
Shopify Partner
5642 1289 1647

@jacauschi23 

Please check the following screenshot Before and After my code.

Before ( without my code )

before-my-code.jpg

 

After ( with my code )

after-put-my-code.jpg

 

Let me know if this is wrong.

 

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
jacauschi23
Explorer
60 9 17

@dmwwebartisan Yes, that's how I would like it to look

0 Likes
dmwwebartisan
Shopify Partner
5642 1289 1647

@jacauschi23 

So you are saying that after entering the above code at the bottom of theme.css file. The layout is not looking the same?

On my side, it is working. Please remove your history or check with incognito mode. The code should work.

Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes