KPC

Kevin Powell - Community

A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.

Join

KPC

Kevin Powell - Community

A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.

Join

front-end

resources

back-end

ui-ux

os-and-tools

help

Trazed

11/15/2023

How can I Tackle down this layout for mobile and desktop size?

As you can see my issue is on how to make these 2 buttons appear at the bottom of the testimonials when going to mobile size, there won't be an issue if I just make this layout work as it is, but then the 2 buttons will have to stay at the top of the testimonials, as drawn with purple marker, any way to tackle this down?

KannanRavindran

11/15/2023

Include other HTML file in the HTML file

So, I have been searching for a way to include header.html to home.html... I used async and await but there is a delay in loading, so is there any other way? I am trying to use innerHTML with DOM. But still, I can see some flickering delay. Is there any other way...?...

rainrain

11/15/2023

Complex layout

How do you guys implement something like this?

Avinash

11/15/2023

Bootstrap forms not appending data in the url via get method

If i submit basic form via get method , data is appended to the URL , but when i used Bootstrap form, the dont see any data being appended. How to fix this? ```js html -> http://127.0.0.1:5500/day7.html when form is submitted http://127.0.0.1:5500/values.html?fname=as&lname=as ...

CDL

11/15/2023

grid child positioning and margins

Yo. I'm trying to figure out if there is a way to move the position of a grid-item inside the grid block. As you can see here, the text and image is spaced out quite a bit, so I wondered if there was a way to have the text sit on the far right of it's block (end?) and the image sit on the far left (start?) https://codepen.io/Laing91/pen/JjxrJOb...

DoContra

11/14/2023

grid responsive

Hi, I would like to know if you can help me, I wanted to know what would be the best possible option to put this responsive display grid, the container is limited to 1280px and the card to a max-width: 270px.

Confused Horse

11/14/2023

Absolute positioned element exceeding (and affecting) scrollable container.

Hello everyone! I recently ran into this tricky situation in which I have an absolute positioned element which is inside of a relative positioned element, which again ist positioned in some other container which allows for vertical scrolling. (there's more to it, but this is a minimal reproducible example). However, the absolute positioned element supposed to be way bigger than the containing element, which cases the container in which they're both placed to be affected. I tried to reproduce the example in a codepen: https://codepen.io/ConfusedHorse/pen/MWLvMbN Because this is just a reduced example, the following properties must not be changed:...

swimmy jones

11/14/2023

Next 14 Session Provider

Does anybody know how to setup a session provider with Next JS 14? I just went through their tutorial, and it was cool, but there's no info on how to setup the session provider, and everything I try online seems to be out of date. I'm considering just switching to a more well documented version of next, but wanted to get the thoughts of you guys before resorting to that. Thanks....

CDL

11/14/2023

Another day of life, another CDL question on Svelte!

https://www.sveltelab.dev/7gkkb6hx4odofjj I'm trying to add some dynamic code to the Header.svelte so that when I click on a link, under the Navbar I'll add my title, see Codepen for example. https://codepen.io/pen/...

sas

11/14/2023

How to create infinite site?

How to create site like miro (infinite)? I mean, i need to create site that you can scroll and scroll in all directions (depending on amount of content, more content, more scrolling). I'm now trying to make this site with overflow: auto, but it works not how I want. Maybe there is some videos about this? More specifically, the result of what I did didn't suit me because I couldn't center the container properly. That is, I had a container main, and in it a container expenses, the container main I did not set the size, as well as the container expenses (but set the size of containers inside expenses), and when I tried to center the container expenses relative to the container main all centered, but the content on the edges of the container expenses became unavailable. And I also want to say that I don't need content generation when scrolling (at least for now), I need to be able to view the entire expenses container content in peace....

Ã̶̅n̴̊͑k̴̾͌s̵̒̐e̵͗̒l̴̿͋

11/14/2023

Border hover animation reversing

Hi, I'd like to reverse my animation when hovering off the element, and not that it disappears without transition like now. Also the animation is weird and glitchy, can't figure out why.. https://codepen.io/axl-prudhomme/pen/XWOayoN?editors=1100...

Kai Cerësy✨

11/14/2023

Border "padding"?

Hello everyone, with a div that has padding-inline, how do you typically styling to achieve a border like this image? I usually add border to pseudo-element like ::after or to a child div instead, just wondering if there is a better way......

Stephin Maju

11/14/2023

how I get this radius?

How I get this border radius

syg

11/13/2023

handling image heights using img/src/sizes with object-fit: cover to overflow width

I have images with object-fit: cover that I need to be full screen images, how can I optimize my images with img, srcset, and sizes when these work exclusively off widths? See the full screen slider here for my issue: https://2x4miniramps.netlify.app/ You'll see that when the image is landscape, it handles correctly (using width), but when the image is portrait it has no clue how to handle the height. ...

CDL

11/13/2023

Svelte routes +page/+layout and src/lib/components

I'm messing around with portfolio ideas and am trying to figure out how to get the damn navbar links to work, so far it's driven me mad for about an hour after googling, chatgpting, svelte docs etc.. https://www.sveltelab.dev/5lyuqf6riwp4az3 What am I after:...

dlongodev

11/13/2023

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...

CDL

11/13/2023

Looking for info on how to add animations to a page load in Sveltekit.

Open up a webpage and upon that initial load, the navbar transitions in 1 word at a time "home" then "about" then "contact" then "projects" or whatever. I've found several videos/guides on how to just do it when clicking between pages, but not on the initial page load itself :/

goky chan, plebku

11/13/2023

{% extends.. block body} is it standard to use or not?

Is it standard to use % extends, block body, end block like in the code below(copied from cs50 video) or is it better to just type out the whole template on each new page with exclamation mark in vs code? ```html (% extends "layout.html" %} ...

marvxkiyi

11/13/2023

How can I make a sticky, pill-shaped button that expands on click to show more navigation links?

Found Nav while searching for inspiration and thought to attempt to recreate it. Turned out to be more complicated than I thought. Is there someone on here that knows how to achieve this? This is how far I got 😓 https://codesandbox.io/s/dynamic-button-tmft35?file=/src/styles.scss This is where I found the sticky button: https://studiorotate.com...

CDL

11/13/2023

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....

Previous Next

Gaming

Programming

Kevin Powell - Community

A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.

Kevin Powell - Community

A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.