esc-theme-includes.css ESC PORTAL BACKGROUND IMAGE

Jeff W NZAO B
Mega Guru

Hello, 

Please I'm trying to configure the css of my esc background image so that the image will be responsive and will not be cut. I updated the esc-theme-includes.css file, and i defined the css parent with the name "esc-homepage-cover " in the Employee Center Homepage - Container 1 page, but the image is still cut on the top and the bottom.

 

Here is the code I added with the sys-id of the image uploaded in the db_image table.

.esc-homepage-cover {
  background-image: url("/sys_image.do?sys_id=f05522cc9fa622107f447b966124ab9f") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  min-height: 400px !important;
  width: 100% !important;
  display: block !important;
  border: 4px solid red !important; /* test visuel */
}

Thanks for your help

JeffWNZAOB_0-1751329172780.png

JeffWNZAOB_1-1751329290039.png

 

 

1 REPLY 1

GlideFather
Tera Patron

Hi @Jeff W NZAO B,

not a CSS expert, but try something similar to:
img {
width: 100%;
height: auto;
}

———
/* If my response wasn’t a total disaster ↙️ drop a Kudos or Accept as Solution ↘️ Cheers! */