k, so I am trying to margin a button a little bit from the left so like margin-left: 10px;
But it wont work.
HTML
But it wont work.
HTML
HTML:
<div class="left">
</div>
<div class="right">
<h1>Melvin Lindström</h1>
<h2>Web Devoloper<br>Studying to become a full time Web Devoloper</br>Html, JavaScript, </h2>
<button class="btn-1" type="button" name="button">Learn More</button>
</div>
Code:
@import url('https://fonts.googleapis.com/css?family=Roboto');
@import url('https://fonts.googleapis.com/css?family=Karla');
* {
padding: 0;
margin: 0 auto;
}
body, html {
height: 100%;
}
.left {
display: inline-block;
position: absolute;
right: 0;
top: 0;
float: left;
width: 100%;
background-image: url("https://i.imgur.com/zNWNuFB.jpg");
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
height: 100%;
}
.right {
display: inline-block;
overflow: hidden;
float: right;
width: 100%;
background-color: #151515;
height: 100%;
-webkit-clip-path: polygon(50% 0, 0 80%, 0 0);
clip-path: polygon(45% 0, 0 60%, 0 0);
opacity: 0.9;
}
.right h1 {
color: white;
margin-left: 2%;
margin-top: 5%;
font-family: Roboto;
font-size: 40px;
}
.right h2 {
color: white;
margin-left: 2%;
margin-top: 2%;
font-size: 15px;
font-family: Roboto;
}
.btn-1 {
display: block;
margin-left: 2px;
margin-top: 2px;
}

