Fix watch mode sticky video and media overflow
Change section.content overflow-x from auto to clip so position:sticky works through it. Add min-width:0 on watch-left to prevent grid blowout. Add overflow:hidden on sticky product-images to contain media.
This commit is contained in:
parent
819c0d630a
commit
4b8d2aa4d3
1 changed files with 13 additions and 2 deletions
|
|
@ -468,11 +468,19 @@ div.product-images img.product-main {
|
|||
}
|
||||
|
||||
/* Prevent content sections from overflowing */
|
||||
.product-description,
|
||||
.product-description {
|
||||
max-width: 100%;
|
||||
overflow-x: auto;
|
||||
box-sizing: border-box;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
/* Use overflow-x: clip on .content so it clips without creating a scroll
|
||||
container — overflow-x: auto breaks position: sticky for descendants */
|
||||
.content,
|
||||
section.content {
|
||||
max-width: 100%;
|
||||
overflow-x: auto;
|
||||
overflow-x: clip;
|
||||
box-sizing: border-box;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
|
@ -1482,6 +1490,7 @@ textarea.markup-editor-textarea {
|
|||
|
||||
.watch-left {
|
||||
grid-area: left;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
/* In watch mode, child divs inside watch-left are plain block elements */
|
||||
|
|
@ -2564,6 +2573,8 @@ textarea {
|
|||
top: 0;
|
||||
z-index: 10;
|
||||
background: var(--bg-primary, #ffffff);
|
||||
overflow: hidden;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
/* Watch video container for unmute overlay positioning */
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue