Помогите с кодом для сайта

Почему код не работает для сайта который вот что выдает на него и вот код <!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ты будешь моей девушкой?</title>
<style>
body {
text-align: center;
font-family: Arial, sans-serif;
background-color: #ffe4e1;
transition: background 0.5s;
}
.container {
margin-top: 50px;
}
.bear {
width: 200px;

По дате

По рейтингу

user_4688100

Искусственный Интеллект

5мес

Код, который в вопросе и код, который на скрине - два разных кода.

iq_185

Оракул

5мес

123456789101112131415161718192021222324252627282930313233

 <!DOCTYPE html> 
<html lang="ru"> 
<head> 
  <meta charset="UTF-8"> 
  <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
  <title>Ты будешь моей девушкой?</title> 
  <style> 
    body { 
      text-align: center; 
      font-family: Arial, sans-serif; 
      background-color: #ffe4e1; 
      transition: background 0.5s; 
    } 
    .container { 
      margin-top: 50px; 
    } 
    .bear { 
      width: 200px; 
      /* Здесь можно добавить дополнительные стили, например: */ 
      height: auto; 
      margin: 20px auto; 
    } 
  </style> 
</head> 
<body> 
  <div class="container"> 
    <h1>Привет!</h1> 
    <p>Ты будешь моей девушкой?</p> 
    <img src="bear.jpg" alt="Милый медведь" class="bear"> 
  </div> 
</body> 
</html>

cogni

Просветленный

5мес

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263

 <!DOCTYPE html> 
<html lang="ru"> 
<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <title>Ты будешь моей девушкой?</title> 
    <style> 
        body { 
            text-align: center; 
            font-family: Arial, sans-serif; 
            background-color: #ffe4e1; 
            transition: background 0.5s; 
        } 
        .container { 
            margin-top: 50px; 
        } 
        .bear { 
            width: 200px; 
        } 
        .buttons { 
            margin-top: 20px; 
        } 
        button { 
            padding: 10px 20px; 
            font-size: 18px; 
            margin: 10px; 
            cursor: pointer; 
            border: none; 
            border-radius: 5px; 
            transition: 0.3s; 
        } 
        .yes { 
            background-color: #4CAF50; 
            color: white; 
        } 
        .no { 
            background-color: #f44336; 
            color: white; 
            position: absolute; 
        } 
    </style> 
</head> 
<body> 
    <div class="container"> 
        <h1>Ты будешь моей девушкой?</h1> 
        <img src="https://i.imgur.com/JyHjzay.png" alt="Мишка" class="bear"> 
        <div class="buttons"> 
            <button class="yes" onclick="alert('Ура! 💖')">Да</button> 
            <button class="no" onmouseover="moveButton()">Нет</button> 
        </div> 
    </div> 
 
    <script> 
        function moveButton() { 
            let button = document.querySelector('.no'); 
            let x = Math.random() * (window.innerWidth - button.offsetWidth); 
            let y = Math.random() * (window.innerHeight - button.offsetHeight); 
            button.style.left = x + 'px'; 
            button.style.top = y + 'px'; 
        } 
    </script> 
</body> 
</html>