Manoj_KumarP Ответов: 2

Как сделать div в центре всех устройств с помощью CSS и HTML ?

Я пытался, но безуспешно. пожалуйста, решите мою проблему.

Что я уже пробовал:

<!DOCTYPE html>





  <title>Bootstrap Example

  <meta charset="utf-8">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  
  
  
  .center{
   height:300px;
   width:300px;
   background:#eee;
   position:absolute;
   margin:-150px 0 0 -150px;
   left:50px;
   top:50px;
   } 
  


<div class="center"></div>

2 Ответов

Рейтинг:
0

Peter Leow

Проверить это: Полное руководство по центрированию div[^]

Рейтинг:
0

jgakenhe

Я вижу много проблем, включая отсутствие закрывающих тегов и отсутствующий тег тела. Кроме того, ваше верхнее поле, будучи отрицательным, заставит текст находиться выше экрана, так что вы его не увидите.

Комментарий Питера выше даст вам ответ, но я предлагаю вам начать с самого начала и прочитать учебник для начинающих по CSS (Учебник по CSS[^]). Это займет час, и примерно через 3/4 вы попадете в макеты (CSS Layout-горизонтальное и вертикальное выравнивание[^]).

<!DOCTYPE html>
<html>
<head>
<style>
.center{margin: auto; width: 60%; border: 3px solid #000; padding: 10px;}
.center-text{text-align: center;}
</style>
</head>
<body>
<div class="center">
  	<p>The div is centered, but the text is not.</p>
	<h4 class="center-text">This is centered text.</h4>
</div>
</body>
</html>