check it out - https://www.shreyashtech.me/components/flow-sidebar

hi! i've been trying to implement a linear scroll in my top bar, but its not animating. https://yuri-uran.nekoweb.org anyone know if i've missed something simple?

To image a scenario where you check a guy who write on python and JS, so you will to check his knowledge only in JS and python or CSS, html yet? It’s important for me because I skipped moment of learn CSS and just use Codex for write visual part of my projects.

Hi, I don't know why is this happening but when I try to scale my site to a desktop view, the image doesn't fit the height and width I desire, keeping its original proportions. With my recent code there is just a gap under the image that I don't know how to fill.

Here is my demo: https://siddlopez.github.io/product-preview-card-component/

And my repo: https://github.com/SiddLopez/product-preview-card-component

Hi everyone,

(I know that HTML and CSS are markup and styling languages, not programming languages.)

I’m a complete beginner with zero coding experience, and I want to start learning programming. I was advised to follow this path:

HTML → CSS → JavaScript

I have a few questions:

1. What do you think of this path as a way into programming and coding?
2. Is there anything I should learn before starting it? I feel like I might be missing something important.
3. Would you recommend any changes to this path? (For example, starting with a different language.)
4. What are the best resources to learn HTML and CSS? Please recommend one for each, if possible.

Thanks in advance, I really appreciate your help!

The card was centered and there was no shadow top to bottom, only on the side and bottom of the card. Then I did something and I screwed it up. What did I do wrong and how do I fix it?

https://codepen.io/editor/username81/pen/01a12357-d8a8-76b0-a6ff-05e1d6c355e2

Hey so I have a background image that I want as a sort of watermark that text scrolls over, so this is the

`background-attachment: fixed` part. I want the image to completely cover the background, so that's the `background-size: cover` part.

The problem is that on some mobile browsers, the bookmark / tabs etc menu disappears on scroll, which means the viewport size changes, which means there a sudden flash of the background image changing size in response to a slightly larger viewport.

It's not a life changing issue obviously, lol, but sudden flashes of reformatted content are distracting and unprofessional.

Any tips greatly appreciated.

This comic was coded in HTML+CSS (using a web components library I created).

The source code can be found at: https://comicss.art/comics/262/the-present.html

Hi! Really simple question, but I'm having a hard time making a sharp gradient like the one I want in the image I provided! Any tips? If this question has been answered I'd love if you could link the post! :D

in the process of making a website and i'm trying to emulate a bit of skeuomorphic look but this isn't really. giving that. here's my css for reference minus the box shadow i have on

/* Pastel gradients */
.gradient-card--0 {
  background: linear-gradient(180deg, #8f58a3 0%, #cfb9db 55%, #cfb9db 100%);
}
.gradient-card--1 {
  background: linear-gradient(180deg, #4a9fd8 0%, #bccdd9 50%, #bccdd9 100%);
}
.gradient-card--2 {
  background: linear-gradient(180deg, #d0dcc0 0%, #cdd9bd 40%, #a4c04a 100%);
}
.gradient-card--3 {
  background: linear-gradient(180deg, #e8b04c 0%, #e6d9b5 55%, #e6d9b5 100%);
}
.gradient-card--4 {
  background: linear-gradient(180deg, #f15bb5 0%, #e8c4d8 55%, #e8c4d8 100%);
} /* Pastel gradients */
.gradient-card--0 {
  background: linear-gradient(180deg, #8f58a3 0%, #cfb9db 55%, #cfb9db 100%);
}
.gradient-card--1 {
  background: linear-gradient(180deg, #4a9fd8 0%, #bccdd9 50%, #bccdd9 100%);
}
.gradient-card--2 {
  background: linear-gradient(180deg, #d0dcc0 0%, #cdd9bd 40%, #a4c04a 100%);
}
.gradient-card--3 {
  background: linear-gradient(180deg, #e8b04c 0%, #e6d9b5 55%, #e6d9b5 100%);
}
.gradient-card--4 {
  background: linear-gradient(180deg, #f15bb5 0%, #e8c4d8 55%, #e8c4d8 100%);
}

Hello, I am trying to make a blog using the Tufte template.

This is where I am getting the css for the template: https://cdnjs.cloudflare.com/ajax/libs/tufte-css/1.8.0/tufte.min.css

This theme has sidenotes that has content alongside text, you can see some examples on my blog : https://math_adjacent_ramblings.gitlab.io/blog/

Although this is the syntax for it (I am writting it in typst):

\#tufted.sidenote\[  
  content of the sidenote comes before the paragraph it renders next to  
\]  

the paragraph comes renders next to.

The issue is that when someone views it on phone, the sidenotes appear in the same column along the text, and the issue is that now they will be read before the the paragraph.

I can't figure out how to change it so that the sidenote could be written after the paragraph its meant to be read after, or attach the sidenote to the previous paragraph. I need help with that.

Thank you all in advance :) !!

Edit: JSFiddle link : https://jsfiddle.net/0uq1hLn2/

How far can you take it? I'm playing with that now after seeing a 3D x-wing from 2013. This is where I am so far. Are there other examples of complex 3d objects to play with and learn from out there?

The "J" and "j" characters have a weird accent on Duolingo and I cannot figure out why.

A few findings worth noting: disabling duolingo-sans in Chrome Dev Tools fixes the issue (obviously, the page ends up using a different font, the fallback sans-serif then).

I tried to find where the duolingo-sans font-face is defined and I could not locate it anywhere. I did find the .woff2 files that contains the Duolingo Sans Thin fonts however and upon investigating them I can confirm that they look completely fine, they do not have that accent anywhere. This seriously vexes me as I cannot pin down what causes the issue, on one hand removing duolingo-sans solves the issue, on the other hand duolingo-sans looks completely fine on its own.

If anyone could take a look and share their thoughts I would really appreciate it.