806,356 questions
Score of 0
0
votes
0 answers
0
answers
4 views
4
views
Having problems with using the hamburger menu
I am trying to use the hamburger menu on my html file with only CSS by using the input:checkbox and labels to toggle between open and close when clicked, and it's been proving quite difficult.
What I ...
Score of 0
0
votes
1 answer
1
answer
56 views
56
views
iOS keyboard breaks page layout when opened
I am using Vite + React + Bootstrap. This is my code:
componentDidMount() {
this.updateAppHeight();
if (window.visualViewport) {
window.visualViewport.addEventListener('resize', this....
Score of 2
2
votes
3 answers
3
answers
112 views
112
views
How could I scroll vertically past an item that only accepts horizontal scrolling?
I am sorry if the title sounds confusing (because it is), but I cannot find a way past this problem. I made some divs that are supposed to scroll horizontally on a list, like the code snippet that ...
Score of 2
2
votes
2 answers
2
answers
142 views
142
views
How do I fix HTML search submit button's erroneous position?
The submit button should be sticking to the text input, but it is not positioned properly, and is instead raised and to the right of the text input. I tried to fix the issue, but I'm stumped.
The ...
Score of -3
-3
votes
2 answers
2
answers
109 views
109
views
scoping CSS custom properties on a component root instead of :root theme variables [closed]
I'm refactoring a multi-section landing page built with Astro and Tailwind v4. Colors are currently mostly global theme tokens. Some sections invert the palette (for example an accent band background ...
Score of -1
-1
votes
1 answer
1
answer
111 views
111
views
CSS adaptive to JS condition [closed]
I am currently building a weather app with Vite and React.
At the moment, the background photo is just a sunny clear sky, and the ad is styled in white and blue around that.
What I want to do is to ...
Score of -2
-2
votes
0 answers
0
answers
50 views
50
views
CSS Grid only outputs one box on the right of the screen instead of header, body, sidebars and footer [duplicate]
Here is my HTML and CSS using CSS Grid. All this outputs is the footer on the far right of the screen and I'm not sure at all what is going wrong.
My desired outcome is something like this:
3x3 grid ...
Score of 0
0
votes
1 answer
1
answer
91 views
91
views
How to ensure an HTML element's "display" CSS property is set to "none" at the END of a transition on Chrome AND Firefox?
I want to make sure an HTML element's "display" property is set to "none" only when that element is in an "open" state AND it is no currently transitioning between the &...
Score of 1
1
vote
1 answer
1
answer
131 views
131
views
How can I make my page scroll past three elements?
I am currently making a page on my website, in which you can scroll between profiles of staff in the company I am developing for. This scrolling is horizontal. Currently, I have 5 items that I can ...
Score of 0
0
votes
1 answer
1
answer
137 views
137
views
CSS layout and animation issues: Sibling hover not triggering animation and absolute positioning breaking
I am building a football animation using purely HTML and CSS (no JavaScript). I am running into three specific issues:
Hover Animation: I want the ball to be set in motion when the home-btn (the ...
Score of -1
-1
votes
0 answers
0
answers
93 views
93
views
How can I vertically align a Plotly chart and a custom HTML card in adjacent Streamlit columns? [closed]
I'm building a dashboard in Streamlit where two columns are displayed side by side. The left column contains a Plotly chart, while the right column contains a custom HTML/CSS card rendered using st....
Score of -1
-1
votes
1 answer
1
answer
112 views
112
views
Why is clip-path: inset() being ignored/overridden in my React component layout? [closed]
I am building a banner component in React (Vite/CRA) where a smartphone image overflows out of the top of a container box, but a background blue circle needs to be clipped cleanly at the bottom edge ...
Score of -1
-1
votes
1 answer
1
answer
122 views
122
views
Flowing ideas across a page [closed]
I want to make a board and inside the board will be different texts flowing across a page with a floating animation, but the "texts" keep overlapping each other. My original idea was that ...
Score of 0
0
votes
1 answer
1
answer
144 views
144
views
How to fix the position with html and css flexbox and position?
I had a problem making the correct position for my paragraph element and the div.
(PS: all is in the photos + the CSS code)Sorry for my bad English, it's not so easy to explain
The photos of the ...
Score of -1
-1
votes
1 answer
1
answer
130 views
130
views
<pre> Overflowing on Smaller Screens
I'm trying to use highlight.js on my blog, but the <pre> component on screens with a small viewport width isn't overflowing as I expected:
I would like the <pre> container to not overflow ...