Ne0n5amura1
@Ne0n5amura1
Lixach

Как изменять расположение разных объектов на странице?

<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 я хотел поставить повыше чем кнопку, причем в точности до пикселя, но каждый раз когда я пытаюсь так сделать ничего не происходит или объект улетает влево. Где я допустил ошибку ?
  • Вопрос задан
  • 541 просмотр
Решения вопроса 1
milokmurlika
@milokmurlika
Няшка
У вас некорректная разметка.
Вот что получается когда браузер проходиться по вашему html:
<body>
  <img class="imgCenter" id="whitewave" src="avatar.png">
  <a id="whitewave" class="buttonStart" href="blogspot.html">Start</a>
  <h1 class="textStart">Welcome, username</h1>
    <table>
      <tbody>
        <tr></tr>
        <tr></tr>
        <tr class="marg"></tr>
      </tbody>
   </table>
</body>

Синтаксис тега table должен быть примерно таким:
<table>
  <tr>
    <td>...</td>
  </tr>
</table>
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы