fix: center parallax hero image cross-browser
Replace Firefox-specific @supports hack with explicit absolute centering (left/right/margin-inline: auto) on the image container.
This commit is contained in:
@@ -122,6 +122,9 @@
|
|||||||
div:has(.placeholder){
|
div:has(.placeholder){
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
margin-inline: auto;
|
||||||
width: min(1000px, 100dvw);
|
width: min(1000px, 100dvw);
|
||||||
height: max(60dvh,600px);
|
height: max(60dvh,600px);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
@@ -131,12 +134,6 @@ div:has(.placeholder){
|
|||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
@supports (-moz-appearance:none) {
|
|
||||||
.placeholder{
|
|
||||||
translate: -50% -50%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* DIALOG */
|
/* DIALOG */
|
||||||
dialog{
|
dialog{
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|||||||
Reference in New Issue
Block a user