<html >
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="style_bg.css">
<link href='https://fonts.googleapis.com/css?family=Roboto&subset=latin,cyrillic' rel='stylesheet' type='text/css'>
</head>
<body>
<table>
<tr><img class="imgCenter" id="whitewave" src="avatar.png"></tr>
<tr><a id="whitewave" class="buttonStart" href="blogspot.html">Start</a></tr>
<tr class="marg"><h1 class="textStart">Welcome, username</h1></tr>
</table>
</body>
body {
background: url("space.jpg");
background-size: 100%;
background-attachment:fixed;
}
@keyframes whitewave {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
#whitewave {
animation: whitewave 2s;
}
.imgCenter {
display:block;
margin:300px auto 300px;
padding:0;
}
.buttonStart {
text-align:center;
display: table;
margin:0 auto;
padding:12px 60px 12px;
font-family: 'Roboto', sans-serif;
font-size: 24px;
color: white;
background: rgba(255, 255, 255, 0);
background-color: rgba(255, 255, 255, 0);
border-radius:8px;
border: 3px solid white ;
z-index: 10;
outline:none;
text-decoration: none;
-webkit-transition: .5s;
transform: scale(1);
}
.buttonStart:hover {
transform: scale(0.9);
}
.buttonStart:active {
transform: scale(0.5);
}
.textStart {
margin:0 auto;
text-align: center;
color: floralwhite;
font-family: 'Roboto', sans-serif;
font-size: 48px;
outline:none;
}
Есть вот такой сайт. Изменять расположение объектов с помощью margin просто невозможно. А дело в том, что надпись welcome я хотел поставить повыше чем кнопку, причем в точности до пикселя, но каждый раз когда я пытаюсь так сделать ничего не происходит или объект улетает влево. Где я допустил ошибку ?