Проблема с CSS

Question

Проблема с CSS

Инсаф Гирфанов Ученик (77), открыт 4 дня назад

Хочу сделать градиентный фон, но у меня он почему то дублируется, как исправить?

Вот код:

 <!DOCTYPE html> 
<html lang="ru"> 
    <head> 
        <meta charset="UTF-8"> 
        <title>Таблица</title> 
    </head> 
    <style> 
        body { 
            background: linear-gradient(to right top, white 0%, red 67%, pink 100%) !important; 
            font-family: "Roboto", sans-serif; 
        } 
         
        .main { 
            font-size: 16px; 
        } 
 
        h1 { 
            text-align: center; 
        } 
 
        .footer { 
            font-size: 12px; 
            text-align: right; 
        } 
    </style> 
    <body> 
        <h1>Суши бар <em>&laquo;Йокогама&raquo;</em></h1> 
        <p class="main">Прайс лист</p> 
        <p class="footer"><i>&copy; Читатели книги &laquo;HTML и CSS&raquo;<br>Все права защищены.</i></p> 
    </body> 
</html>

Answer 1

 <!DOCTYPE html>  
<html lang="ru">  
    <head>  
        <meta charset="UTF-8">  
        <title>Таблица</title>  
        <style>  
            body {  
                background: linear-gradient(to right top, white 0%, red 67%, pink 100%) !important; 
                font-family: "Roboto", sans-serif; 
                margin: 0; 
                min-height: 100vh; 
                background-repeat: no-repeat; 
                background-attachment: fixed; 
            }  
             
            .main {  
                font-size: 16px;  
            }  
 
            h1 {  
                text-align: center;  
            }  
 
            .footer {  
                font-size: 12px;  
                text-align: right;  
            }  
        </style>  
    </head>  
    <body>  
        <h1>Суши бар <em>&laquo;Йокогама&raquo;</em></h1>  
        <p class="main">Прайс лист</p>  
        <p class="footer"><i>&copy; Читатели книги &laquo;HTML и CSS&raquo;<br>Все права защищены.</i></p>  
    </body>  
</html>