Решено Как пропистать в стилях, контакты для мобильной версии

[Ivan777]

Доброго вечера, извиняюсь, если неправильно тему обозначил, суть в следующем: Сайт http://kupit-uggi.com/ (storefront) прописал контакты, прописал в стилях, чтобы все встало по центру, все вышло, но в мобильной версии с телефона, все слетает и выглядит криво, что прописать еще в стилях, чтобы в мобильной версии все стояло ровно. Заранее спасибо!

 

[Moonlight31]

Доброго вечера, извиняюсь, если неправильно тему обозначил, суть в следующем: Сайт http://kupit-uggi.com/ (storefront) прописал контакты, прописал в стилях, чтобы все встало по центру, все вышло, но в мобильной версии с телефона, все слетает и выглядит криво, что прописать еще в стилях, чтобы в мобильной версии все стояло ровно. Заранее спасибо!

Необходимо использовать медиа запросы

Например:
В style.css дописать

@media (max-width: 320px) {
    .entry-content span {
        text-align: center;        
    }
}

где .entry-content span, это стиль, который вы применяете к тексту

 

[Ivan777]

Добрый день, вставил код в стили, но ничего не изменилось((

 

[Moonlight31]

Добрый день, вставил код в стили, но ничего не изменилось((

Добрый день! Этот код - пример для разрешения 320 px

@media (max-width: 320px) - это медиазапрос, который объявляет, какие настройки будут применены для экрана, максимальная ширина которого 320px.

Далее Вам необходимо посмотреть, для какого компонента необходимо задать настройки, т.е.

@media (max-width: 320px) {
.ваш_компонент {
text-align: center;
}
}

 

[Moonlight31]

Добрый день, вставил код в стили, но ничего не изменилось((

Для мобильных устройств нужно использовать медиа запросы под конкретные разрешения экрана.

 

[Ivan777]

Сделал как Вы и сказали, но всё на своих местах(
@media (max-width: 320px)
{
.phone_header_text
{
text-align: center;
}
}
Может нужно прописать отдельное меню для мобильной версии сайта? как на этом сайте? у них, в мобильной версии совсем все по другому в шапке. http://uggaustralian-online.ru/

 

[Moonlight31]

Сделал как Вы и сказали, но всё на своих местах(
@media (max-width: 320px)
{
.phone_header_text
{
text-align: center;
}
}
Может нужно прописать отдельное меню для мобильной версии сайта? как на этом сайте? у них, в мобильной версии совсем все по другому в шапке. http://uggaustralian-online.ru/

Для мобильной версии я бы скрыл все эти данные в header и перенес в footer. Оставил бы только меню и логотип в header

@media (max-width: 320px) {
.phone_header {
    visibility: hidden;
}
}

 

[Ivan777]

К сожалению, все без изменений(

 

[Ivan777]

Для мобильной версии я бы скрыл все эти данные в header и перенес в footer. Оставил бы только меню и логотип в header

А как скрыть все эти данный в хедере и оставить только логотип и меню для моб. версии?

 

[Moonlight31]

Прописать медиазапрос для разрешения и объявить условие display: none;
для .phone_header, phone_header_text big_grpah, phone_text ya-phone

 

[Ivan777]

Спасибо большое!!, с помощью последней команды, убрать контакты в мобильной версии получилось!!))