Дополнительный пробел перед div рядом с div-оболочкой - PullRequest
Новая
       0

Дополнительный пробел перед div рядом с div-оболочкой

0 голосов
/ 26 мая 2020

Получить пустую строку перед div с id = "test". Не нужно пространство перед тестовым div. Обертка div с родительским и дочерним элементом существует рядом с ним. Пробовал много css, но не смог удалить пробел. 

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Coe</title>
    <link rel="stylesheet" href="styles.css">
    <style>
    .footer-mgblock {
      border:1px solid red;
   margin:0px;
     padding:0px;  
    }


    .footer-mgblock  .mainSection {

        background: #000000;
        border:1px solid green;
        color: #FFFFFF;
        padding:0px; 
         margin: 0px;

    } 



</style>
</head>
<body>
<p> Hello </p> 
<link href="https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300;700&display=swap" rel="stylesheet">


<div class="footer-mgblock">

    <div class="mainSection">
       child
    </div>

</div>​
<div id="test" style="border:1px solid red;margin:0px;padding:0px">
   testdiv
</div>


</body>

Ответы [ 2 ]

1 голос
/ 26 мая 2020

У вас есть непонятный символ непосредственно перед #test <div>. Вам нужно удалить его, и пробел исчезнет.

Скопируйте и вставьте приведенный ниже код (примечание: символ не отображается в формате кода SO, но вы можете увидеть его, если скопируете код в CodePen - https://codepen.io/fraggley/pen/VwvNJZe - посмотрите на тег </div> непосредственно перед div #test): 

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Coe</title>
    <link rel="stylesheet" href="styles.css">
    <style>
    .footer-mgblock {
      border:1px solid red;
   margin:0px;
     padding:0px;  
    }


    .footer-mgblock  .mainSection {

        background: #000000;
        border:1px solid green;
        color: #FFFFFF;
        padding:0px; 
         margin: 0px;

    } 



</style>
</head>
<body>
<p> Hello </p> 
<link href="https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300;700&display=swap" rel="stylesheet">


<div class="footer-mgblock">

    <div class="mainSection">
       child
    </div>

</div>
<div id="test" style="border:1px solid red;margin:0px;padding:0px">
   testdiv
</div>


</body>
0 голосов
/ 26 мая 2020

Удалить лишнее закрытие div tag 

 .footer-mgblock {
       border:1px solid red;
       margin:0px;
       padding:0px;  
    }

 .footer-mgblock  .mainSection {

      background: #000000;
      border:1px solid green;
      color: #FFFFFF;
      padding:0px; 
      margin: 0px;

    } 
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title></title>
</head>

<body>
<p> Hello </p> 
<link href="https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300;700&display=swap" rel="stylesheet">
<div class="footer-mgblock">
 <div class="mainSection">child</div>
<div id="test" style="border:1px solid red;margin:0px;padding:0px">
   testdiv
</div>


</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...