Bom dia, não sou nenhuma expert nisto e estou cansada de procurar uma solução para contrariar o skew dado ao container principal. Basicamente todas as soluções que até agora consegui compreender não resolvem.
Os elementos em cima da imagem consegui através de css fazer o transform skew contrário ao container principal e ficou tudo ok, mas não consigo fazer o mesmo à imagem de background que está a ser chamada no controlo (visto que esta não tem um caminho direto, tem uma relação com pastas à qual vai buscar essa imagem).
ASP.NET
divBedroomContainer.Attributes.Add("style", "background-image: url(" + trimmedFolder + trimmedBedroom + ".jpg)");
CSS
.Bedrooms {
-webkit-backface-visibility: hidden;
-webkit-transform: skewY(-2.7deg);
transform: skewY(-2.7deg);
outline: 1px solid transparent;
}
.BedroomContainer {
float: left;
width: 33.3334%;
background-repeat: no-repeat;
background-size: cover;
position: relative;
height: 400px;
text-align: center;
overflow: hidden;
}