Skip to content

M
madhan-task
Commit 5e7a4684 by Madhankumar
Options

initial commit

parent f536ae0a
Showing with 27 additions and 56 deletions
index.html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="style.css" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
......
style.css
*{
margin:0;
padding:0;
}
.cont{
display:flex;
flex-wrap:wrap;
min-height:100vh;
}
.cont{
min-height: 100vh;
}
.card{
float:left;
width:33.333%;
}
.card .card-desc{
padding:28px;
display:flex;
align-items:center;
justify-content:space-between;
height: 100%;
}
.cont:after{
content: "";
clear: both;
display: table;
}
.card-text,.card-image{
float: left;
width:50%;
}
.card-text{
font-size: 18px;
.card p{
color:white
}
.card-text img{
.card .card-text img{
height:50px;
object-fit: contain;
aspect-ratio: 3/2;
......@@ -35,9 +37,10 @@
height: 300px;
object-fit:contain;
}
.card p{
color:white
.card-text{
font-size: 18px;
}
.cardbg1{
background:#41ca6e;
}
......@@ -56,36 +59,4 @@
.cardbg6{
background:#4ec2e7;
}
hr{
height: 2px;
background-color: white;
border: none;
}
.card .card-desc .card-text{
margin:49px;
}
/* small screen */
@media only screen and (max-width:768px){
.card{
flex-basis:100%;
}
.card .card-desc{
display: flex;
flex-direction: column;
}
}
/* medium screen */
@media only screen and (min-width:769px)and (max-width:1024px){
.card{
width:50%;
}
}
\ No newline at end of file
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment