Issue with `display: column` with an absolute positioned element
I need help! I'm trying to avoid using
Masonry.js library bc I have a simple page for testimonials that works perfectly with display: column but I'm encountering an issue with the quote icon I set up with absolute position. Those svgs are not perfectly aligned in the second and third column. I recreated the issue in CodePen: https://codepen.io/Daniele-Longo/pen/KKJvNoG. I could target the div that is in the top, but I was hoping for a more dynamic solution since my user may have to add or r...
Positioning and resizing SVG's?
https://codepen.io/pen/
My goal here is to have this be much larger, and act as a background image, something I'm messing with to see if I like it.
I thought I could just set a width/height to style the svg but apparently it's not that simple. Ideally I Want this in the middle of the screen, blurred in the background, so I can add content over the top....
When I load the website the hamburger menu is open and closes immediately
Hey. I am following Kevin's Responsive navbar tutorial using HTML CSS & JS. Everything works except when I add
transition: transform 350ms ease-in to .primary-navigation when I load the website at width below 800px/resize it below 800px of width, the hamburger menu is open and it immediately closes: https://zakazkolcow.pl/ What am I missing?
The code of the header is here: https://codepen.io/Iga-the-sasster/pen/poGryBY...
Running into an issue when viewport reaches a certain threshold
Ive been doing the CRL course and I'm trying a challenge but when the viewport gets below a certain width everything just goes towards the left and I'm left with whitespace on the right, the more smaller the viewport gets the more to the left everything goes, if that makes sense. I can't remember what the solution to this was but I'd appreciate any help!
Dropdown won't go back when it slides down
I've cloned Kevin's responsive css navbar and added a dropdown feature, now i'm having trouble trying to get the dropdown list to slide back up when i scroll away from the parent element. Please assist! Here is my code in CodePen.
https://codepen.io/highkeysaiyan/pen/YzBQbQG...
Complex responsive layout
How should I structure this layout?
In the desktop version, there are 3 sections within the right sidebar, separated by equal gaps, but in the mobile version, there is just one grid....
Me again - Sveltekit, where to store css when using routes
I currently have my page setup like so.
From what I understand in the svelte tutorial, +layout.svelte is where I want to store anything global? would this also include global css, or should I still be storing that elsewhere, like my lib/styles/globla.css folder.
At the moment all I have in my +layout.svelte is an import from global.css, and my navbar. Should I be moving my navbar into a Header.svelte file, or is it perfectly fine here?...
Change close icon color in bootstrap
i want to change the color of my close icon to white so that it matches the color of the navbar elements i have used a class navbar-close-white it is changing the color but it is not same as the other navbar elements also can i increase it's weight.here is my code"https://codepen.io/Talha-Mustafa/pen/XWOgzGe
Overflowing contents? Or Something else
Hi , i am trying to make it responsive but going down through the breakpoints am having an issue as all the contents is overflowing, i don't know what causing this. I've marked in blue lines the in right is the issue.(Using tailwindcss too)
Adjusting iframe size for mobile responsiveness in Tailwind CSS
I am currently working on a project where I have a grid layout containing an iframe with audio content. I'm using Tailwind CSS for styling, and I'm facing an issue with making the iframe fit the mobile responsive screen. The first picture is my website and the second picture is how I want my plug in for apple music to fit.
The issue is that the iframe doesn't adjust properly for mobile screens. I've tried adjusting the width, height, maxWidth, and maxHeight properties, but I'm not achieving the desired responsiveness. If anyone can help with this that'll be lovely!
...
Help with footer layout
Ok so I watched Kevin's video about alternative to wrapper and decided to refactor my project using that method but now I have a problem doing the layout of the footer that's
full-width and because of that is itself a grid container with those grid columns style and I originally had it as a flex container that wrapped.
To make it grid I need to define new columns but I can't since they're already defined and if I overwrite it it breaks and I'm not sure how to do it safely.
The result should be like in the picture, if code is needed just ask me.
(Note that the project of the footer in the image is not done with the grid layout of Kevin's video)...