Witam mam taki problem, ponieważ button, który jest na stronie nie chce przybrać takie miejsca jakie mu podaje tylko się nie rusza.
tak wygląda --->
Button znajduje się w <header></header>
a tu kodzik przycisku:
.button {
margin-left:auto;
margin-right:auto;
margin-top:300px;
background-color: #4CAF50; /* Green */
border: none;
color: white;
padding: 16px 32px;
text-align: center;
text-decoration: none;
font-size: 16px;
margin: 4px 2px;
-webkit-transition-duration: 0.4s; /* Safari */
transition-duration: 0.4s;
cursor: pointer;
background-color:transparent;
}
.button1 {
color: black;
border: 2px solid #4CAF50;
}
.button1:hover {
background-color: #4CAF50;
color: white;
}
A tu kodzik headera w ktorym jest przycisk:
.header {
min-height:100vh;
padding-top:70px;
padding-bottom:250px;
background: url('img/header.jpg') center/cover no-repeat;
text-align: center;
text-shadow: 0 0 15px rgba(0, 0, 0, .3);
}
.header h1{
font-size: 70px;
color: #66BF7C;
margin-bottom: 19px;
font-family: 'Righteous', cursive;
}
.header p{
font-size: 30px;
color: white;
font-family: 'Poiret One', cursive;
}
A tak wygląda to w HTML:
<div>
<header class="header">
<h1>Margo news</h1>
<p>Zaufana i niezależna strona, tylko prawdziwe informacje.</p>
<button type="button" class="button button1">SPRAWDŹ WIADOMOŚCI!</button>
</header>
</div>