Our Work Breakpoint Samples


#1

Hello.

At breakpoint ~768px and higher my Our Work samples show in a row of three.
At breakpoint ~767px and lower my Our Work samples show in a row of two.
Could you tell me please how to keep the row of two samples until breakpoint 1024px is reached - and then anything larger than 1024px, the samples would go to three rows.

Site link: http://creativew.com/theme

Thanks again!
Esteban


#2

Dear Esteban,

I would like to apologize in advance for delayed respond.

Could you please try to add the following CSS code through the Simple Custom CSS plugin?

@media only screen and (max-width: 1024px){
  
  .roll-project.fullwidth .project-item {
    width: 50% !important;
  }  
  
}

Regards,
Kharis


#3

Perfect! Thank you Kharis.
Topic Solved.


#4

Kharis,

My apologies. I see that creating the row of two worked perfectly at breakpoint 1024px, but now on smaller viewports the rows stay in two samples, where previously it was one sample. Could you tell me please how to have the row show one sample at breakpoint 768px and lower.

Thanks,
Estevan


#5

Dear Esteban,

Try the following code.

@media only screen and (min-width:480px) and (max-width: 1024px){
  
  .roll-project.fullwidth .project-item {
    width: 50% !important;
  }  
  
}

Regards,
Kharis


#6

Thank you. I was able to play with a bit more code and found a solution, eliminating a chance of code. Looks like it’s working well.

Topic Resolved :slight_smile: