VS Code CSS bazı kodlar çalışmıyor

CSS:
@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');

:root{
    --size: max(5px, 1vmin)
    --height: 80em;
    --pad: 1.25em;
    --border-radius: 6.666em;
    --gutter: calc(var(--pad) * 2);
    --button-width: 0.333em;
    --notch-height: 3.33em;
    --notch-width: 3.33%;
    --notch-radius: calc(var(--border-radius) - calc(var(--pad) * 2));
    --notch-duration: 0.333s;
    --ease: cubic-bezier(.666, 0, .4, 1)
    --ease-spring: cubic-bezier(.666, 0, .4, 1.2);
    --ease-out: cubic-bezier(.15, 0, .333 ,1);
    --border-width: 0.4em;
    --deep-purple: 284;
    --gold: 30;
    --space-black: 215;
    --silver: 254;
    --c-h: var(--deep-purple);
    --c-s: 100%;
    --c-l: 50%;
}

@-webkit-keyframes appear{
    to{
        transform: scale3d(1, 1, 1);
        opacity: 1;
    }
}

@keyframes appear{
    to{
        transform: scale3d(1, 1, 1);
        opacity: 1;
    }
}

body{
    background: #00000a;
    display: flex;
    flex-direction: column;
    gap: 3em;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    font-family: 'Inter';
    font-size: var(--size);
}

.phone{
    position: relative;
    z-index: 1;
    aspect-ratio: 37/76;
    background: black;
    height: --hegth;
}
 
CSS:
@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');

:root{
    --size: max(5px, 1vmin)
    --height: 80em;
    --pad: 1.25em;
    --border-radius: 6.666em;
    --gutter: calc(var(--pad) * 2);
    --button-width: 0.333em;
    --notch-height: 3.33em;
    --notch-width: 3.33%;
    --notch-radius: calc(var(--border-radius) - calc(var(--pad) * 2));
    --notch-duration: 0.333s;
    --ease: cubic-bezier(.666, 0, .4, 1);
    --ease-spring: cubic-bezier(.666, 0, .4, 1.2);
    --ease-out: cubic-bezier(.15, 0, .333 ,1);
    --border-width: 0.4em;
    --deep-purple: 284;
    --gold: 30;
    --space-black: 215;
    --silver: 254;
    --c-h: var(--deep-purple);
    --c-s: 100%;
    --c-l: 50%;
}

@-webkit-keyframes appear{
    to{
        transform: scale3d(1, 1, 1);
        opacity: 1;
    }
}

@keyframes appear{
    to{
        transform: scale3d(1, 1, 1);
        opacity: 1;
    }
}

body{
    background: #00000a;
    display: flex;
    flex-direction: column;
    gap: 3em;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    font-family: 'Inter';
    font-size: var(--size);
}

.phone{
    position: relative;
    z-index: 1;
    aspect-ratio: 37/76;
    background: black;
    height: --heigth;
}
Hocam dediğimi yapmamışsınız. ease-spring'in üstündeki satırın sonuna noktalı virgül koyun.

CSS:
[CODE=css]
@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');

:root{
    --size: max(5px, 1vmin)
    --height: 80em;
    --pad: 1.25em;
    --border-radius: 6.666em;
    --gutter: calc(var(--pad) * 2);
    --button-width: 0.333em;
    --notch-height: 3.33em;
    --notch-width: 3.33%;
    --notch-radius: calc(var(--border-radius) - calc(var(--pad) * 2));
    --notch-duration: 0.333s;
    --ease: cubic-bezier(.666, 0, .4, 1);
    --ease-spring: cubic-bezier(.666, 0, .4, 1.2);
    --ease-out: cubic-bezier(.15, 0, .333 ,1);
    --border-width: 0.4em;
    --deep-purple: 284;
    --gold: 30;
    --space-black: 215;
    --silver: 254;
    --c-h: var(--deep-purple);
    --c-s: 100%;
    --c-l: 50%;
}

@-webkit-keyframes appear{
    to{
        transform: scale3d(1, 1, 1);
        opacity: 1;
    }
}

@keyframes appear{
    to{
        transform: scale3d(1, 1, 1);
        opacity: 1;
    }
}

body{
    background: #00000a;
    display: flex;
    flex-direction: column;
    gap: 3em;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    font-family: 'Inter';
    font-size: var(--size);
}
.phone{
    position: relative;
    z-index: 1;
    aspect-ratio: 37/76;
    background: black;
    height: --height;
}
 

Yeni konular

Geri
Yukarı