Програмирање - савети и недоумице

RIA77

Iskusan
Poruka
5.601
Поштовани чланови форума,
не могу да учитам екстерни CSS фајл.
Желео бих да ми један део сајта буде само са једним стилом, али не могу то да подесим.
.mojmeni
{ @import url(mojmeni.css);
margin:100px 100px 100px 100px; text-align:left;
}
Maргине раде лепо, али никако да се учита фајл, шта сам погрешио у синтакси ?
 

RIA77

Iskusan
Poruka
5.601
Za početak, mislim da ti fale navodnici. Možeš kao string,

@import "mojmeni.css";

ili kao URL

@import url("mojmeni.css");

Nadam se da je lokacija CSS fajla ispravna.
Не знам где сам омашио, не ради ни једно ни друго. Приказује текст, али га не стилизује. css се налази у фолдеру поред индекс фајла.
 

RIA77

Iskusan
Poruka
5.601
Ради, међутим имам нови проблем. Централни део сајта ми је померен у леву страну.
Такође и css мени маргина не ради никако.
{
margin:150px 100px 100px 100px; text-align:center;
}
Ставим маргину 1 исто као 100, нешто не ради, не могу да вратим централни елемент, а и учитан фајл не ради.
Хвала.
 

Baby Yoda ♥

Contributor
Poruka
18.189
Ради, међутим имам нови проблем. Централни део сајта ми је померен у леву страну.
Такође и css мени маргина не ради никако.

Ставим маргину 1 исто као 100, нешто не ради, не могу да вратим централни елемент, а и учитан фајл не ради.
Хвала.
Ne možemo ti pomoći ako ne vidimo ceo kod. Ko zna šta si sve tu nameštao u relaciji sa tim pa je možda nešto drugo poguralo.
 

RIA77

Iskusan
Poruka
5.601
@import url("mojmeni.css"); - locirano u okviru header

```body { font-family: sans-serif;
font-family: monospace;
text-transform: uppercase;
backgroud: #999;
}

.container {
height: 100vh;
width: 100vw;
display: flex;
justify-content: center;
align-items: center;
}

ul {
display: flex;
flex-direction: row;
font-size: 22px;
}

li {
position: relative;
list-style-type: none;
margin-right: 50px;
cursor: pointer;
color: black;
}
li:last-child {
margin-right: 0px;
}
li:after {
content: "";
position: absolute;
z-index: -1;
left: 50%;
transform: translateX(-50%) rotate(0deg);
}

li:nth-child(1):after {
background: #ED4337;
}

li:nth-child(2):after {
background: #A1D3A2;
}

li:nth-child(3):after {
background: #50B8E7;
}

li:nth-child(4):after {
background: #efe200;
}

li:nth-child(1):after {
clip-path: polygon(6% 10%, 100% 0, 64% 65%, 28% 65%);
height: 85px;
width: 75px;
bottom: -47px;
animation: stretch 2s ease infinite;
}
@keyframes stretch {
25% {
transform: translateX(-50%) rotate(2deg) scaleY(0.93);
}
50% {
transform: translateX(-50%) rotate(-2deg) scaleX(0.93);
clip-path: polygon(6% 20%, 100% 0, 64% 65%, 28% 65%);
}
75% {
transform: translateX(-50%) rotate(3deg) scale(1.05);
}
}

li:nth-child(2):after {
clip-path: polygon(61% 0%, 100% 19%, 71% 100%, 0% 100%);
height: 55px;
width: 75px;
bottom: -18px;
animation: stretch2 1.5s ease infinite;
}
@keyframes stretch2 {
25% {
transform: translateX(-50%) rotate(-2deg) scaleY(1.05);
}
50% {
transform: translateX(-50%) rotate(2deg) scaleY(0.93) scaleX(1.06);
clip-path: polygon(61% 0%, 100% 19%, 71% 100%, 12% 100%);
}
75% {
transform: translateX(-50%) rotate(3deg) scale(1.05);
clip-path: polygon(61% 0%, 80% 19%, 71% 100%, 12% 100%);
}
}

li:nth-child(3):after {
clip-path: polygon(0% 0%, 100% 0%, 100% 99%, 0% 57%);
height: 55px;
width: 45px;
bottom: -18px;
animation: stretch3 2s ease infinite;
}
@keyframes stretch3 {
25% {
transform: translateX(-50%) rotate(-2deg) scaleY(1.05);
}
50% {
transform: translateX(-50%) rotate(2deg) scaleY(0.93) scaleX(1.06);
clip-path: polygon(10% 5%, 100% 0%, 100% 99%, 0% 57%);
}
75% {
transform: translateX(-50%) rotate(3deg) scale(1.05);
clip-path: polygon(0% 0%, 100% 0%, 100% 99%, 10% 37%);
}
}

li:nth-child(4):after {
clip-path: polygon(0% 40%, 100% 0%, 100% 99%, 19% 100%);
height: 55px;
width: 45px;
bottom: -18px;
animation: stretch4 2s ease infinite;
}
@keyframes stretch4 {
25% {
transform: translateX(-50%) rotate(-2deg) scaleY(1.05);
}
50% {
transform: translateX(-50%) rotate(2deg) scaleY(0.93) scaleX(1.06);
clip-path: polygon(0% 40%, 100% 0%, 100% 99%, 19% 100%);
}
75% {
transform: translateX(-50%) rotate(3deg) scaleY(1.05);
clip-path: polygon(0% 40%, 100% 0%, 100% 99%, 19% 100%);
}
}

li:hover:after {
animation: boink 1s ease forwards 1;
}
@keyframes boink {
80% {
transform: scaleX(1.9) scaleY(0.6) translateX(-30%);
}
}

@MEDIA (max-width: 600px) {
li {
font-size: 15px;
}
}

Потребно је да урадим екстерни css као мени на сајту.
3D вртешка ми се скроз поремети када убацим екстерни фајл.
Молим за помоћ.
 

Top
  Blokirali ste reklame
Dragi prijatelju, nemojte da blokirate reklame - isključite Ad Blocker na Forumu, jer će tako mesto vaših susreta na Krstarici ostati besplatno za korišćenje.