Kevin Powell - Community

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

Footer won't stay at bottom

I am trying to figure out how to get the footer of this page, https://testmage.cluster.helpmefence.com/store/resources-1.html, to stay at the bottom. I cannot recreate this in codepen because many files go into making our pages. Any help would be appreciated. TIA!

Best practice mark up and CSS

Just a couple of question for how to best structure code. 1. I saw in one of Kevins videos that there is an HTML element called <blockquote>. Should I use that instead of <article> in this mark up? 2. For the large quote signs in red I'm going to use ::before and ::after. Should they be put on the container element (either <article> or <blockquote>), or the first and last <p> ...

Calender

Im trying to create a calendar using Python/Django. So far I got this: https://i.imgur.com/FfnXiUG.png This is with the calendar library from Python. This generates a bunch of html:...

Type 'ConnectionState' is not assignable to type 'boolean'

I am getting this error when I use a function to monitor whether the internet is there or not. Can anyone help me to resolve this error? Here is the app,component.ts file ``` import { Component } from '@angular/core'; import { ConnectionService, ConnectionState } from 'ng-connection-service'; ...

force Cards to same height

https://codepen.io/ahad4387/pen/wvxLOev?editors=1000 I'm trying to achieve horizontal scrollbar with all cards of same height. I'm using fixed width right now, but is it possible to make adjust the width to match height of largest card? i've tried align-self:normal, i'm not understanding why it's not working...

Possible to provide autofill options to the browser?

Pretty much just the above - I'd like to make a form textarea mandatory, but also make the process easy by providing a couple of templates/options to those who still can't be bother to fill it out. Would be nice if I could provide the browser with a few options to populate its autofill.

React issue

Why The div is not changing its display when the window is loaded

Help with height responsiveness!

Project link: https://benevolent-seahorse-6c9816.netlify.app/ I drawing a blank in figuring out how to make my mid section follow changes in height. So if you go into responsive mode, and start stretching screen vertically or diagonally it should do the same, instead of being glued to the top. 😦...

Calender

Im mostly doing this to learn, but I have a design in mind where there's a calender (like with almost any kind of scheduling tool). Im trying to figure out how to acutally set it up, my assumption would be that I need a hugh grid (green) https://i.imgur.com/lJAhMjN.png. The next issue is that I don't understand how to:...

SVG path

Can anyone explain how this path code works?

Why my Grid row is not shrinking?

When the viewport width is less than 1480px the Grid layout starts to shrink but the first row's height is not changing. Why is this happening? `` .card-wrapper { display: grid; grid-template-columns: repeat(4, 1fr);...

What might be the best way to create this?

I need to create this container and it should be responsive. When someone hover there should be a little movement in the pictures. Any suggestion how to create this thing. If you can even refer some resources that would be awesome.

Tag shape

How would you guys do this with CSS? Ignoring the color and font family....

Shift scroll from vertical to horizontal

I have multiple horizontal scrollbars of image galleries, one after the other. Is it possible to shift from a normal vertical scroll to horizontal if the page reached the gallery, once the horizontal scroll is completed vertical should start...

Automated styling testing?

Hi there, I was wondering what's the common practice when it comes to testing the style of your whole website. What I mean is, there are libraries like react-library-testing/cypress that can carry out multiple tests in order to check if something on a different part of the website was broken in the process, checks if a button no longer exists or doesn't open a popup, etc. Is it possible to do that with styles? I'm thinking maybe a Puppeteer script that takes screenshots of all the pages in your...

Gsap ScrollTrigger and a click event using scrollTop highlighting menu items

I've a menu where each item corresponds to a section div. Click on an item, it adds a border-bottom, and scrolls somewhere vaguely near the element (because life, and scroll-padding, just can't be that easy). Simple stuff. But then I've added ScrollTrigger to track which section I'm above when scrolling and change the active menu item accordingly. This unfortunately means that when you click a menu item, say item 4, it now scrolls to 4, but highlights menu items 1,2,3 and then 4 on the way there....

How to add content below centered div

The red part of the image is an element centered to the screen with flex, but I also want to add some content below that, without affecting its position. How can I do that?

Js error on click event.

Trying to make a passenger counter app and stuck on getting my save button functionality to work. I get this error "'saveNumber' is declared but its value is never read.ts(6133)" when I try to set a saveNum var on line 27. I'm not understanding what I'm doing wrong here? https://codepen.io/ezekielswanson/pen/MWBdZbP...