Homepage imgage grid aligned to left, same vertical line like the header

How can I arrange the image grid (Sydney FP: Latest News – A and Sydney FP: Latest News – B) aligned to the left of the same line at the homepage? And the buttons too?

Regards,
Steff

Please try adding the below custom CSS code into your site’s additional CSS option under Appearance > Customize > Additional CSS.


.latest-news-wrapper{
  width: calc(100% + 30px);
  margin-left: -15px;
}

@media only screen and (min-width:768px){
  
  .widget_sydney_latest_news{
    width: calc(100% + 30px);
    margin-left: -15px;
  }

  .widget_sydney_latest_news .widget-title{
    margin-left: 15px;
  }  
  
}

Regards,
Kharis

Thank you.
I remove

border: 1px solid red;

But header and content have not the same distance to the left. There is a difference between the header “glaßer und…” and the content section “Erfahren Sie…”, “Hotelgärten…” etc.

How can I move the buttons “Weitere Projekte…” to the left?

Regards,
Steff

Try to replace these lines:


.widget_sydney_latest_news .widget-title{
  margin-left: 15px;
} 

with:


.widget_sydney_latest_news .widget-title{
  margin-left: 14px;
}  

> How can I move the buttons “Weitere Projekte…” to the left?

Try adding this code:


.more-button{
  margin-left: 0;
}

Regards,
Kharis

Hi Karis,

Thank you.

  1. It works. Perfect.

  2. I cannot see a difference. Please look the screenshot:

Regards,
Ingo