Начать новую тему

Не удается отредактировать блок

Здравствуйте! Никак не удается отредактировать блок в шапке сайта-Доставка во все регионы. В связи с этим прошу помочь: 1. Секция данного блока имеет ращмер 3, такой же как на секции сверху над ней (Список сравнения). Надо чтобы они по правому и левому краю были ровно друг над другом. Т.е машинка под значком, тексты также по правому краю друг над другом. 2. Надо чтобы блок поиска, машинка, текст Доставка во все регионы и Телефонные номера шли по одной оси симметрии (сейчас они скачут по высоте-не красиво). Подскажите, как можно двигать вверх-вниз блоки Доставка во все регионы и блок с телефонными номерами? 3. Как можно, например свойствами css, менять расстояние между строчками текста? Сейчас если делаешь стандартными методами одинаковый текст и междустрочное расстояние в блоке Телефоны и в блоке Доставка во все регионы-по факту оно получается разным.

Здравствуйте, Владислав.


Как мы видим, иконки по умолчанию выровнены по левому краю:



Боюсь, что из-за разного размера изображений расположить их точно друг под другом не получится.


> тексты также по правому краю друг над другом


Отобразить текст точно под фразой Список сравнения проблематично из-за разного размера вышеупомянутых иконок.


> Надо чтобы блок поиска, машинка, текст Доставка во все регионы и Телефонные номера шли по одной оси симметрии (сейчас они скачут по высоте-не красиво). Подскажите, как можно двигать вверх-вниз блоки Доставка во все регионы и блок с телефонными номерами?


Как мы видим, все блоки выровнены по одной высоте.

Позицию иконки в рамках блока с HTML-содержимым вы можете изменить с помощью свойства margin-top, которое уже задано для иконки. Вам потребуется лишь изменить его значение.


С помощью того же свойства, примененного ко всему блоку, вы можете изменить позицию по вертикали всего блока, если это необходимо.


> 3. Как можно, например свойствами css, менять расстояние между строчками текста? Сейчас если делаешь стандартными методами одинаковый текст и междустрочное расстояние в блоке Телефоны и в блоке Доставка во все регионы-по факту оно получается разным.


Межстрочный интервал зависит от выбранного шрифта. Если вам необходимо изменить значение, которое выставляется для размера шрифта автоматически, рекомендуем воспользоваться свойством line-height.


Спасибо.


Мария, спасибо за быстрый ответ. Остались неясными несколько моментов: 1. Почему нельзя текст сделать в две строчки и вручную сместить слова "Доставка во" и "все регионы!" вправо, чтобы, чтобы во и восклицательный знак встали точно под букву я в слове Список сравнения? Ведь сама секция такой же ширины (3), как и та, что над ней! 2. Как задать пользовательские сss стили (сейчас эти поля пустые), чтобы потом можно было двигать этот блок и секцию с помощью margin-top? 3. Какой пользовательский css стиль (или как его задать) у данного текста, чтобы потом можно было менять межстрочный интервал с помощью line-height?
Здравствуйте, Владислав!

> Мария, спасибо за быстрый ответ. Остались неясными несколько моментов: 1. Почему нельзя текст сделать в две строчки и вручную сместить слова "Доставка во" и "все регионы!" вправо, чтобы, чтобы во и восклицательный знак встали точно под букву я в слове Список сравнения? Ведь сама секция такой же ширины (3), как и та, что над ней!


Мы настроили показ текста Доставка во все регионы в две строчки и под текстом Список сравнения. Текст не показывался желаемым образом, так как секции, в которых находились блоки были выровнены по-разному. Мы выбрали вариант Вся ширина в настройке Выравнивание содержимого для обеих секций. Также для секции с блоком Список сравнения был задан Пользовательский CSS класс, в котором определялись отступы для блока. Мы добавили новый пользовательский CSS класс dostavka-regioni для секции с блоком Доставка во все регионы и так же задали для этого класса отступы.

2. Как задать пользовательские сss стили (сейчас эти поля пустые), чтобы потом можно было двигать этот блок и секцию с помощью margin-top?

Пользовательский CSS класс для секции, в которой находится блок Список сравнения был у вас задан и мы также задали Пользовательский CSS класс (dostavka-regioni) для секции с блоком Доставка во все регионы. Пользовательские CSS классы для секций задаются в соответствующем поле Пользовательский CSS класс в настройках секции и затем правила для этих классов можно описывать в редакторе тем или на странице Дизайн > Стили.

3. Какой пользовательский css стиль (или как его задать) у данного текста, чтобы потом можно было менять межстрочный интервал с помощью line-height?

Пользовательский CSS класс для блока можно задать в настройке блока Пользовательский CSS класс. Мы задали его для блока Доставка во все регионы - doctavka-region-block и добавили свойство line-height для этого класса в секцию Пользовательские CSS-стили вашего редактора тем.

Пожалуйста, проверьте.

Спасибо.


Арина, спасибо большое за помощь. Но теперь появились проблемы с мобильной версией (см. вложение). Машинка уехала влево, текст уехал вправо :)
png

Владислав,


Пожалуйста.


Я изменила содержимое блока Доставка во все регионы и теперь в мобильной версии иконка отображается рядом с текстом. Текст блока отображается справа, так как в предыдущем сообщении вы спрашивали, как сместить его вправо и сделать под текстом Список сравнения.


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


Информацию по работе с различными CSS свойствами вы можете найти на данных ресурсах:


http://htmlbook.ru/

http://www.w3schools.com/css/


Примеры и решения различных проблем с версткой можно найти на многочисленных форумах по CSS и HTML.


Спасибо.

Арина, спасибо бооьшое!
Владислав,

Пожалуйста, я была рада помочь.

 


Войдите, чтобы опубликовать свой комментарий