Bymas | Шарящие в css

Cezarionis (21.08.2019 в 00:36)
Ее в 2019 году нужно уже автоматически исключать.

единственный адекватный ответ в теме

Dizzy221 (21.08.2019 в 11:38)
единственный адекватный ответ в теме

Тогда на 10 пост ответь. Как релизовать такое (просто может я что не знаю)

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<style>
* {margin: 0; padding: 0}
.grid {
display: grid;
grid-template-areas:
"img-block damage"
"img-block hp"
"img-block protection"
"img-block attack";

background: #505050;
padding: 20px;
}
.grid div {
display: flex;
justify-content: center;
align-items: center;
}
.grid div span {
color: #fff;
}
.img-block {
grid-area: img-block;
}
.img-block img {
width: 200px;
}
.damage {
grid-area: damage;
}
.hp {
grid-area: hp;
}
.protection {
grid-area: protection;
}
.attack {
grid-area: attack;
}
</style>
<body>
<div class="grid">
<div class="img-block"><img src="https://avatars.mds.yandex.net/get-zen_doc/162989/pub_5c7914d452a2d900b354b31c_5c791526677b0c00b3a3eca8/scale_600" alt=""></div>
<div class="damage"><span>Урон: 60</span></div>
<div class="hp"><span>HP: 100</span></div>
<div class="protection"><span>Защита: 180</span></div>
<div class="attack"><button>Атаковать</button></div>
</div>
</body>
</html>
________
посл. ред. 21.08.2019 в 12:37; всего 2 раз(а); by Mistika

TuT (21.08.2019 в 11:58)
Тогда на 10 пост ответь. Как релизовать такое (просто может я что не знаю)

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

TuT (21.08.2019 в 11:36)
Хорошо, допустим. Вот перед тобой такая задача встала.Есть несколько карт (в онлайн игре) на них по 100 элементов. Как генерировать будешь?Я к примеру в несколько строк кода в PHP сделаю. Так что выбрасывать таблицу не нужно.

Также блоками и сделаю. И с php сгенерирую эти блоки. Блочная верстка устарела.

Cezarionis (21.08.2019 в 12:50)
Также блоками и сделаю. И с php сгенерирую эти блоки. Блочная верстка устарела.

Ну набросай пример, с ссылками на каждый элемент. Всего 100 элементов.

Dizzy221 (21.08.2019 в 12:49)
речь в целом о табличной верстке простых элементов, по типу той что решает автор, а не о том что ты говоришь, я не понял особо о чем ты имеешь ввиду, но догадываюсь

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

TuT (21.08.2019 в 13:19)
Ну, а я к тому, что не всегда удобно через CSS делать верстку и выбрасывать полностью таблицы ещё рано.

Таблицы нужно использовать по прямому назначению. А в качестве верстки они давно себя изжили.

Mistika (21.08.2019 в 15:18)
Таблицы нужно использовать по прямому назначению. А в качестве верстки они давно себя изжили.

Жаль письма для рассылки только благодаря этим костылях табличным делаются, они ещё не додумались к новому чему-то