Привет ! Эпопея с кнопкой продолжается. Она отказывается становиться выше поближе к тексту над ним и растягиваться на весь размер кнопки(возможно сейчас ничего не понятно, но я предоставлю код и скрины)
HTML :
<!DOCTYPE HTML>
<html>
<head>
<title>Blog</title>
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/css" href="font.css">
</head>
<body>
<header>
</header>
<main >
<div class='topback'>
<img class='logo' src="D:\HTML\MyBlog\Foto\logo_795.png">
<div class="text1"><p>Hi there! We are the new kids on the block<br> and we build awesome websites and mobile apps.
</p></div>
<button class="button1">
<img src="D:\HTML\MyBlog\Foto\shape_34_556.jpg">
</button>
</div>
</main>
<footer>
</footer>
</body>
</html>
Также код с кнопкой в формате SVG:
<!DOCTYPE HTML>
<html>
<head>
<title>Blog</title>
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/css" href="font.css">
</head>
<body>
<header>
</header>
<main >
<div class='topback'>
<img class='logo' src="D:\HTML\MyBlog\Foto\logo_795.png">
<div class="text1"><p>Hi there! We are the new kids on the block<br> and we build awesome websites and mobile apps.
</p></div>
<button class="button1">
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
width="296px" height="73px" viewBox="0 0 296 73">
<path fill-rule="evenodd" fill="#eb7d4b"
d="M6.0,1.9997559 C6.0,1.9997559 290.99994,1.9997559 290.99994,1.9997559 C293.2091,1.9997559 295.0,3.7904053 295.0,5.999634 C295.0,5.999634 295.0,67.99942 295.0,67.99942 C295.0,70.20865 293.2091,71.999664 290.99994,71.999664 C290.99994,71.999664 6.0,71.999664 6.0,71.999664 C3.7907715,71.999664 1.999939,70.20865 1.999939,67.99942 C1.999939,67.99942 1.999939,5.999634 1.999939,5.999634 C1.999939,3.7904053
3.7907715,1.9997559 6.0,1.9997559 Z"/>
</svg>
</button>
</main>
<footer>
</footer>
</body>
</html>
.topback{
width: 1440px;
height: 596px;
background-color: #87509c;
margin-left: 12%;
}
.back2{
width: 1440px;
height: 747px;
background-color: #17c2a4;
margin-left: 12%;
}
.back3{
width: 1440px;
height: 914px;
background-color: #e7f1f8;
margin-left: 12%;
}
.back4{
width: 1440px;
height: 655px;
background-color: #ffffff;
margin-left: 12%;
}
.back5{
width: 1440px;
height: 1423px;
background-color: #ffdd99;
margin-left: 12%;
}
.back6{
width: 1440px;
height: 895px;
background-color: #d74680;
margin-left: 12%;
}
.back7{
width: 1440px;
height: 819px;
background-color: #3c5499;
margin-left: 12%;
}
.backfooter{
width: 1440px;
height: 112px;
background-color: #344b8e;
margin-left: 12%;
}
.logo{
width: 118px;
height: 37px;
margin-left: 212px;
margin-top: 60px;
}
.text1{
font-family: TitilliumWeb-ExtraLight;
font-size: 42.2px;
line-height: 48px;
font-weight: 700;
color: #f7f3ea;
margin-left: 267px;
margin-right: 267px;
margin-top: 50px;
margin-bottom: 240px;
text-align: center;
}
.button1{
margin-left: 500px;
margin-bottom: 50px;
}
Я пробовал множество способов такие как: менял кнопку из расширения SVG, jpg, png, менял текст над кнопкой и его CSS.
Средний
