Блок «Ассортимент»

Курсы Промежуточные испытания
1 

<div class="price-list">
          <h2>Ассортимент</h2>
          <table>
              <tr>
                <th>Название</th>
                <th>Алк.</th>
                <th>Ккал.</th>
                <th>Объём</th>
                <th>Стоимость</th>
              </tr>
            <tr>
              <td>Классика</td>
              <td>&lt; 1,2%</td>
              <td>33</td>
              <td>300 мл.</td>
              <td>120 Р.</td>
            </tr>
            <tr>
              <td>Шабаш</td>
              <td>&gt; 1,2%</td>
              <td>45</td>
              <td>330 мл.</td>
              <td>250 Р.</td>
            </tr>
            <tr>
              <td>Вахтёр</td>
              <td>&lt; 1%</td>
              <td>35</td>
              <td>0,5 Л</td>
              <td>150 Р.</td>
            </tr>
            <tr>
              <td>Романтик</td>
              <td>&lt; 0,5%</td>
              <td>27</td>
              <td>0,5 Л</td>
              <td>90 Р.</td>
            </tr>
          </table>
        </div>

Не понимаю в чем проблема, ячейки заголовка прописал, но они сдвинуты в оригинале.

И можно как то прописать в html псевдокласс “Новинка”, чтобы не использовать css?

2

Проблема в том, что у вас более узкий первый столбец - вот все и сдвинуто, по сравнению с оригиналом. А более узкий он получился, потому что вы опустили слово “новинка” - это никакой не псевдокласс, а обычное слово. Вспомните, как в математических формулах задавался верхний индекс - вот точно так же и здесь.

1 лайк
3

Понимаю. Просто есть такой псевдокласс NEW, он создает такой лейбл. Почему то его сразу вспомнил)

4

нету такого псевдокласса, это вы что-то путаете :)))
можно для псевдоэлемента в качестве контента задать любой текст, в т.ч. NEW, и как вы говорите, создать “такой лейбл” - но это не будет какой-то специальный псевдоэлемент, а уж тем более псевдокласс.

5

Может быть я и вправду что-то напутал, скорее всего вы правы насчет вставки контента, пересмотрю свои мысли по этому поводу)

6

Аналогичная ситуация возникла, вот только “новинка” я написала верхним индексом и промежуток между названием кваса и словом новинка тоже есть, а все равно не так.

<table>
    <tr>
        <th>Название</th>
        <th>Алк.</th>
        <th>Ккал</th>
        <th>Объём</th>
        <th>Стоимость</th>
    </tr>
    <tr>
        <td class="assortment-name">Классика</td>
        <td>&lt; 1,2%</td>
        <td>33</td>
        <td>330 мл</td>
        <td>120 Р.</td>
    </tr>
    <tr>
        <td class="assortment-name">Шабаш</td>
        <td>&gt; 1,2%</td>
        <td>45</td>
        <td>330 мл</td>
        <td>250 Р.</td>
    </tr>
    <tr>
        <td class="assortment-name">Вахтёр<sup> Новинка</sup></td>
        <td>&lt; 1%</td>
        <td>35</td>
        <td>0,5 л</td>
        <td>150 Р.</td>
    </tr>
    <tr>
        <td class="assortment-name">Романтик<sup> Новинка</sup></td>
        <td>&lt; 0,5%</td>
        <td>27</td>
        <td>0,5 л</td>
        <td>90 Р.</td>
    </tr>
</table>
</div>

апро.JPG706×273 19.5 KB

7

Пробелы (промежутки) должны быть после названий марки кваса, а не перед словом “новинка”.

8

Большое спасибо!!!)