Cheeseburger CSS by @lola.harrel - Codewith.it

#main, .loader-cont { display: none; } JavaScript disabilitato.
Non puoi usare Codewith.it senza JavaScript.

Referenze

<link>Collega il documento corrente con una risorsa esterna
heightDetermina l'altezza di un elemento HTML in pixel
<select>Usato per creare un menu a tendina.
<table>Tag primario per la creazione di tabelle
langSpecifica la lingua del contenuto di un elemento
multipart/form-dataCodifica dei caratteri di un form

Utenti

Accedi per cercare utenti

Esplora

Trova ispirazione

Esercizi 05/03/2024 es8

Design, Marketing & AI News (Y)

Calcolatrice classica

Textify beta 20

Programma per la salute

5/10/24 es. 7 -parole ripetute

HTML

CSS

JS

terminal console

feedback

add_box Nuovo

cookie Informativa

Informativa privacy e cookies

Utilizziamo cookie o tecnologie per finalità tecniche e, con il tuo consenso, anche per altre finalità come specificato nella cookie policy. Il rifiuto del consenso può rendere non disponibili alcune funzioni. Leggi di più sull'informativa privacy

Clicca su “Accetta” per acconsentire.

<html>
<head>
</head>
<body>
 <div id="topbun"></div>
 <div id="cheese"></div>
 <div id="meat"></div>
 <div id="bottombun"></div>
</body>
</html>

#topbun{background-image: linear-gradient( brown, rgb(249,164,102,255), brown);
height: 210px;
width: 210px;
position: relative;
left: 600;
border-radius: 30px 0px 0px 0px;
box-shadow: 8px 8px 15px 0px rgb(187, 185, 185);}
#cheese{background-image: linear-gradient(rgb(252, 252, 63),rgb(246, 184, 69));
height: 210px;
width: 210px;
position: relative;
left: 830px;
top: -210px;
box-shadow: 8px 8px 15px 0px rgb(187, 185, 185);
}
#meat{background-image: linear-gradient(rgb(159,87,48,255),pink,rgba(159,87,48,255));
height: 210px;
width: 210px;
position: relative;
left: 600px;
top: -190px;
box-shadow: 8px 8px 15px 0px rgb(187, 185, 185);
}
#bottombun{background-image: linear-gradient(rgb(249,164,102),brown,rgb(249,164,102));
height: 210px;
width: 210px;
position: relative;
left: 830px;
top: -400px;
border-radius: 0px 0px 30px 0px;
box-shadow: 8px 8px 15px 0px rgb(187, 185, 185);
}


@media (max-width: 600px){
#topbun{background-image: linear-gradient( brown, rgb(249,164,102,255), brown);
Position: relative;
Left: 0; 
height: 70px;
width: 310px;
border-radius: 50px 50px 0px 0px;
box-shadow: 0px 0px 10px 6px rgb(255,231,195,255);}
#cheese{background-image: linear-gradient(rgb(252, 252, 63),rgb(246, 184, 69));
height: 60px;
width: 300px;
position: relative;
left: 0;
top: 15px;
border-radius: 100px;
box-shadow: 0px 0px 10px 9px rgb(254,213,148,255);
}
#meat{background-image: linear-gradient(rgb(159,87,48,255),pink,rgba(159,87,48,255));
height: 60px;
width: 300px;
position: relative;
Left: 0px;
top: 31px;
border-radius: 100px;
box-shadow: 0px 0px 10px 9px rgb(254,213,148,255);
}
#bottombun{background-image: linear-gradient(rgb(249,164,102),brown,rgb(249,164,102));
height: 70px;
width: 310px;
position: relative;
left: 0px;
top: 45px;
border-radius: 0px 0px 50px 50px;
box-shadow: 0px 0px 10px 10px rgb(255,231,195,255);}
}