div и padding, отступ для вложенного блока

240
10 декабря 2016, 10:40

Извините за тривиальный вопрос.

Есть div

    <div id="bot">
  <?php
      include_once "getFromShukudai.php";
  ?>
</div>

В getFromShukudai.php цикл на получение данных из таблицы

 while ($row = $result->fetch_assoc()) {
    echo "<div class='sample'>";
       echo $row["name"] . $row["message"] ."<br>". $row["timestamp"] .  "<br>";
       echo "</div>";}

После добавления в стили кода, отступ не появляется.

.sample{
  padding-left: 40px;
}

Но когда в Ctrl + Shift + I меняю стиль .sample, отступ появляется. Почему так происходит?

Polnaya versiya 

<!DOCTYPE html>
<html>
  <head>
  <link rel="stylesheet" type="text/css" href="mystyle.css">
    <meta charset="UTF-8" />
    <title>HTMLのサンプル</title>
    <link rel="stylesheet" href="hello.css">
  </head>
  <body>
    <div id="top">
    <form  method="POST" action="connectionToShukudai.php">
      <table width="100%" cellspacing="0" cellpadding="4">
    <tr>
  <td align="left" width="100">name</td>
   <td><input type="text" name="name" placeholder="TextBox" maxlength="550" size="20"></td>
</tr>
<tr>
   <td align="left" align="right">message</td>
<td> <textarea name="comment" value="TextBox" placeholder="TextBox" maxlength="550" size="20"></textarea></td>
  </tr>
  <tr>
  <td><input type="submit" value="BUTTON"/></td>
  </tr>
</form>
  </div>
  </table>
<div id="bot">
  <?php
      include_once "getFromShukudai.php";
  ?>
</div>
  </form>
  </body>
</html>

getFromShukudai.php

<?php
//mysqliクラスのオブジェクトを作成
$mysqli = new mysqli('localhost', 'test', 'test', 'ajc0802');
//エラーが発生したら
if ($mysqli->connect_error){
  print("接続失敗：" . $mysqli->connect_error);
  exit();
}
$query = "SELECT * FROM shukudai";
if($result = $mysqli->query($query)){
  while ($row = $result->fetch_assoc()) {
    echo "<div class='sample'>";
       echo $row["name"] . $row["message"] ."<br>". $row["timestamp"] .  "<br>";
       echo "</div>";
}
}
$mysqli->close();
?>

mystyle.css

2 lines (21 sloc)  351 Bytes
#top {
    background-color: #666666;
    /*position: absolute;*/
}
#bot{
  background-color: yellow;
  padding-top: 30px;
  border-style:solid;
  border-width:1px;
}
.sample{
  background-color: white;
  border-style:solid;
  border-width:1px;
  border-radius: 5px;
  style="width: 960px;
  padding-left: 40px;
}
body{
  background-color: #b3b3b3;
}
Answer 1

Для начала у вас ошибка в генерации css класса .sample

  border-radius: 5px;
  style="width: 960px;
  padding-left: 40px;
Answer 2
  1. Пользуйтесь редактором кода который умеет автоформатировать(Brackets, Atom ...)
  2. Отделяйте HTML и PHP, шоблонизаторы или как минимум функции форматирования (printf).

Из ошибок:

  1. Не правильная вложенность у вас

открываються:

div > form > table

закрываютья:

form > div > table

  1. Битые стили смотрите ответ @AndreyFedorov.
ПОСЛЕДНИЕ ВОПРОСЫ
Все вопросы
Подробнее о сайте beauty-health.com.ua
ТОП-10
READ ALSO
Как в циклической карусели изменить у центрального элемента прозрачность?
HTML

Как в циклической карусели изменить у центрального элемента прозрачность?

Есть зацикленная карусель owl carousel 2 у которой элементы изначально полупрозрачные, а при наведении становятся непрозрачнымиХочу сделать так,...

 1004
Как выводить объект через Id на js?
HTML

Как выводить объект через Id на js?

Допустим мы пользуемся JSON API Tumblr ну или любой какой то летныИ когда получаем значение photo-caption через jquery то содержания записей получаем в таком...

 238
HTML в ListView
HTML

HTML в ListView

Доброго времени сутокИмеется html-текст, выводимый в ListView

 294
psd в wordpress
HTML

psd в wordpress

Я верстаю обычные страницыНо есть много заказов типа "psd to wordpress", чем отличается верстка под вордпресс от обычной? Что нужно дополнительно...

 246