1
Я работаю на целевой странице только для личного использования, но у меня возникла проблема. У меня есть div с радиусом границы, его называется .popOut. Радиус границы применяется к нижней части div, но не к части заголовка, почему? И как я могу это исправить? Также, если вы знаете, как сделать коробочную тень немного легче и не такой темной, что было бы здорово! Благодаря!border-radius не применяется к вершине div
Код:
HTML:
*{margin:0; padding:0;}
body{
\t background: #CCC;
\t color:#000305;
\t font-size: 87.5%;
\t font-family: Arial, 'Lucida Sans Unicode';
\t line-height: 1.5;
\t text-align: left; \t
}
.body{
\t margin: 0 auto;
\t width: 70%;
\t background:#ebebeb;
\t margin:auto;
}
.mainBack{
\t margin:auto;
\t background:white;
\t width:600px;
\t height:650px;
}
.popOut{
\t background:white;
\t width:80%;
\t height:600px;
\t margin:auto;
\t box-shadow:0px 0px 15px 0px;
\t border-radius:6px;
\t position:relative;
\t top:30px;
}
.mainHeader{
\t background:linear-gradient(#465BF6,#3149F2);
\t width:100%;
\t height:100px;
}<html>
\t <head>
\t \t <meta charset="UTF-8">
\t \t <title>
\t \t \t Welcome!
\t \t </title>
\t \t <script type="text/javascript" src="jquery.js">
</script>
\t \t <script type="text/javascript" src="script.js">
</script>
\t \t <link rel="stylesheet" href="style.css" type="text/css">
\t </head>
\t <body class="body">
\t \t <div class="mainBack"> \t
\t \t \t <div class="popOut">
\t \t \t \t <div class="mainHeader"></div>
\t \t \t \t <div class="mainArea"></div>
\t \t \t \t <div class="mainAreaB"></div>
\t \t \t \t <div class="mainFooter"></div>
\t \t \t </div> \t
\t \t </div>
\t </body>
</html>
просто скопируйте и вставьте в текстовый файл –