Сергей Ермилов

Есть все в документации. Важно понимать про позиционирование и работу relative и absolute. Пример расположения текста по четырем углам и по центру.

Стили:

.container {
  position: relative;
  text-align: center;
  color: white;
}

.bottom-left {
  position: absolute;
  bottom: 8px;
  left: 16px;
}

.top-left {
  position: absolute;
  top: 8px;
  left: 16px;
}

.top-right {
  position: absolute;
  top: 8px;
  right: 16px;
}

.bottom-right {
  position: absolute;
  bottom: 8px;
  right: 16px;
}

.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

HTML:

<div class="container">
  <img src="imgage.jpg" style="width:100%;">
  <div class="bottom-left">Низ, слева</div>
  <div class="top-left">Верх, слева</div>
  <div class="top-right">Верх, справа</div>
  <div class="bottom-right">Низ, справа</div>
  <div class="centered">По центру</div>
</div>

Изучил API 2Gis, вот это вот skin=dark работает только для элементов управления. Вам, скорее всего, хотелось перекрасить всю карту в темный цвет (как ночью), но это скорее всего в API не заложено, это пользователь выбирает в настройках.

Вы можете поиграться на Codepen, где сейчас стоит light и описание маркера на светлом фоне, а меняете в URL скрипта на Dark и описание маркера становится темным:



Для пользователя же их приложения есть 4 режима:

1. Как в приложении
Навигатор и приложение 2ГИС всегда будут работать с одними настройками. Если тёмная тема включена в приложении, то она будет действовать и в навигаторе. Если выключить тёмную тему в приложении, она автоматически отключится в навигаторе.
2. Автоматический
Тёмная тема будет включаться автоматически после захода солнца и выключаться — после восхода.
3. Включён всегда
4. Выключен

В основном, когда браузер впервые сталкивается с элементом, который не должен быть в head, например, с элементом img, он закрывает head и вместо этого запускает body. Так что возможно, что есть что-то перед wp_head, что вызывает проблему.

Вам нужно изучить фактический вывод HTML на наличие ошибок, а не смотреть на PHP, чтобы выяснить, что является причиной проблемы. Попробуйте запустить сайт через validator.w3.org и посмотреть на первые несколько ошибок, которые он найдет.

Вы, вероятно, смотрите на исходник страницы с помощью инспектора браузера, который показывает вам DOM в памяти после того, как браузер исправил его, а не истинный исходник страницы, который, вероятно, будет в другом порядке. В Chrome, например, сравните разницу между использованием Web-инспектора и View->Developer->View Page Source, который покажет вам реальный код вывода до того, как браузер обработает его).

Еще можно попробовать поставить wp_head в самое начало перед head. Может быть есть ошибки в scripts.js, который идет перед head.

В любом случае, это попытка вашего браузера избежать недействительной разметки. Сайт выводит что-то, что не принадлежит тегу head, поэтому браузер закрывает его и открывает тег body. Если не плагины, то может быть в functions.php. Надо смотреть хуки для подключения CSS, JS, jQuery и добавления мета-тегов.

Например, во всех wp_enqueue_script добавить $in_footer = true для вывода скриптов в футере.

По вашему описанию сложно сказать. Нужно для вашего конкретного шаблона line-height последовательно смотреть для всех тегов от дочернего до родительского - a, p, li, ul, div.

Если у вас выделенный красным фрагмент - это список (ul, li), то скорее всего для li нужно менять line-height.

В Google Chrome в консоли выделите элемент, посмотрите код и перейдите во вкладку "Computed" (рядом со Styles), она как правило покажет какой line-height и от кого наследуется.

Когда добавляли в статьей фотографии или галереи - вы указывали, чтобы ссылка вела на медиафайл? Если забыли, то при добавлении фото выбирайте: ссылка -> медиафайл.

Если техническая проблема, то нужно смотреть ошибки в консоли или копать плагин конкретный.

Для удобства пользователей. Уже давно ввели понятие Человеко-Понятные УРЛ. Сделано это для того, чтобы пользователи могли запомнить адрес страницы и ввести его сразу в адресную строку браузера.