Как сделать так, чтобы кнопки не съезжали после скрытия текста?

223

24 сентября 2018, 01:20

<!DOCTYPE html>
<meta charset="utf-8" /> 
<html>
<head>
    <title>Четкаятаблица</title>
<link rel="stylesheet" href="main.css" type="text/css"> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
</head>
<body>
<div id = "polska">POLSKA</div>
<div id = "buttonsId">
  <button id = "hide" onclick="$('#polska').fadeOut(1000)">Убрать</button>
  <button id = "show" onclick="$('#polska').fadeIn(1000)">Показать</button>
</div>

Answer 1

#polska { 
  font-size: 24px; 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<div id="polska">POLSKA</div> 
<div id="buttonsId"> 
  <button id="hide" onclick="$('#polska').animate({opacity:0},1000);">Убрать</button> 
  <button id="show" onclick="$('#polska').animate({opacity:1},1000);">Показать</button> 
</div>