Lab 5 CSS
unknown
css
2 years ago
2.8 kB
14
Indexable
Lab 5
html {
font-size: auto;
/* background-color: aquamarine; */
}
body {
font-family: 'Times New Roman', Times, serif;
margin: 0 auto;
padding: 0;
max-width: 900px;
/* background-color: aqua; */
}
.table {
border: 0%;
width: 100%;
padding: 0%;
margin: 0%;
display: flex;
flex-direction: row;
flex-wrap: wrap;
background-color: rgb(255, 255, 255);
}
.col30 {
width: 35%;
max-width: 250px;
padding: 0;
background-color: rgb(34, 136, 219);
}
.col70 {
width: 65%;
padding: 0;
background-color: white;
}
.profile {
font-family: 'Courier New', Courier, monospace;
background-color: rgb(34, 136, 219);
text-align: center;
padding: 20px;
}
.profile:hover{
background-color: rgb(255, 0, 0);
}
.profile img {
border-radius: 50%;
width: 100px;
height: 100px;
}
@media screen and (min-height: 400px) {
.profile img {
width: 150px;
height: 150px;
}
}
@media screen and (max-width: 600px) {
html {
font-size: 14px;
}
}
@media screen and (min-width: 600px) and (max-width: 900px) {
html {
font-size: 20px;
}
}
@media screen and (min-width: 900px) {
html {
font-size: 26px;
}
}
@media screen and (max-width: 700px) {
.col30, .col70 {
flex: 100%;
}
.col30 {
max-width: none;
}
}
.profile textarea {
width: 100%;
}
.address {
font-family: 'Courier New', Courier, monospace;
background-color: rgb(34, 136, 219);
text-align: left;
padding: 20px;
}
.address:hover{
background-color: rgb(255, 0, 0);
}
.address input {
width: 80%;
}
.address select {
width: 82%;
}
.contact {
font-family: 'Courier New', Courier, monospace;
background-color: rgb(34, 136, 219);
text-align: left;
padding: 20px;
}
.contact:hover{
background-color: rgb(255, 0, 0);
}
.contact textarea {
width: 100%;
}
.button {
background-color: rgb(34, 136, 219);
}
.personalinfo {
font-family: 'Courier New', Courier, monospace;
background-color: rgb(202, 220, 83);
text-align: left;
padding: 20px;
}
.personalinfo:hover{
background-color: rgb(255, 0, 0);
}
.personalinfo input{
width: 80%;
}
.education {
font-family: 'Courier New', Courier, monospace;
background-color: rgb(18, 181, 10);
text-align: left;
padding: 20px;
}
.education input{
width: 80%;
}
.education:hover{
background-color: rgb(255, 0, 0);
}
.skill {
font-family: 'Courier New', Courier, monospace;
background-color: rgb(121, 124, 119);
text-align: left;
padding: 20px;
}
.skill:hover{
background-color: rgb(255, 0, 0);
}
.skill textarea {
width: 80%;
}Editor is loading...