All Questions
3,851 questions
2
votes
1
answer
109
views
Box-Shadow Clipping Issue with horizontal scroll
I’m relatively new to CSS and building a website using HTML and CSS (no experience with JavaScript). I have a horizontal scrolling section for some highlight 'cards' using a CSS Grid. Each card has a ...
1
vote
1
answer
107
views
How to enable horizontal scrolling without showing scrollbar on desktop [closed]
I am trying to create an "ecommerce website" and I added product cards in a row and the cards that overflow I want to be converted into horizontal scrollable style.
I have tried using "...
2
votes
0
answers
49
views
How to allow a slider item to overflow only from the top on hover, but hide overflow on the sides in a swiper slider? [closed]
Question:
I’m working with Swiper.js slider and have a hover effect on each slide where the slide grows in size and moves upward, overflowing outside the main slider container.
My goal is:
On hover, ...
1
vote
3
answers
94
views
Navbar overflows when emulating from phone
Mobile menu should not be visible and it should not overflow when used from phone. When I just decrease the browser on the computer it works as intended.
Here is my code.
HTML:
document....
0
votes
1
answer
63
views
Does scrollbar-gutter work with horizontal scrollbars?
I'm trying to use the scrollbar-gutter CSS property to reserve space for the scrollbar and avoid layout shifts. It works well for vertical scrolling, but I want it to reserve space for a horizontal ...
0
votes
0
answers
20
views
Any way to disable HTML scroll for any page containing inner scrollable component?
I am facing an issue which happens only in iOS devices. I'm using Nextjs 15.2.3.
Whenever I visit a page which contains an inner scrollable component (a list for example), I can drag as well as scroll ...
2
votes
1
answer
94
views
How to make one element shrink while two other elements stay the same
async function main() {
const numStudents = Number(await new Modal('a\n\na\n\na\n\na\n\na\n\na', 'info', 'How many students do you have?', 'Cancel', 'Submit').response());
const numGrades = ...
1
vote
0
answers
83
views
Why does this flex-container overflow?
I have a flex-container with a fractional pixel width with 8 flex-children. I expect the container to not overflow, but it does.
The browser is Chrome or Edge on Windows. (Not in Firefox.)
The ...
1
vote
2
answers
94
views
How can I add a scrollable container inside a flex column layout?
I have a simple flex column layout and some CSS helper classes (I added everything to the runnable code snippet).
Everything looks good...
...until I add a lot of text inside the red div.
/* Height ...
0
votes
1
answer
41
views
Make an element visible in scrollable area
When using a scrollable area is it possible with CSS to position a specific element to be in the "viewport", like scrolling to a certain element to make it visible. Here is an example below ...
0
votes
2
answers
68
views
What is causing the overflow?
I am making this website, and I started to get x-overflow. For reference I am only having this issue for mobile sized screens, hence why I only have the one media included. I can't seem to find out ...
0
votes
1
answer
38
views
How do I stop Overflow from interfering with TranslateZ()?
I am trying to have a scrollable area that has a parallax effect using Vanilla Tilt.js when hovering over a Div. When I don't have Overflow on the Div, the parallax effect works, CodePen, but when I ...
0
votes
2
answers
78
views
Visible scrolling behind view
I have the following DOM hierarchy and CSS
body {
margin: 0;
}
#main {
width: 100vw;
height: 100vh;
background-color: LightCyan;
}
#container {
display: flex;
justify-content: ...
0
votes
1
answer
44
views
Why is my parent overflowing as soon as there are more than 1 child in it?
As soon as I add any element above my .inner div, my parent's padding bottom will be ignored. Why is this behaviour and is there a better approach for my problem?
I have this minimal html code, also ...
1
vote
1
answer
44
views
Form disable the overflow
I try to implement an overflow in Form react-router, that's work in a classic <div></div> but when I use <Form></Form> my overflow doesn't work. I don't find any topic who talk ...