Помогите с версткой 2х блоков

[Android]

Есть 2 блока они криво https://gyazo.com/8a59be1e3d79b7b5dba0cd4941eb19a8 отображаются, если вставить их в описание товара, нужно что бы они не рушили верстку и нормально отображались на мобильной и десктопной.

 

<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 text-center" style="box-sizing: border-box; text-align: center; position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; float: left; width: 570px; font-family: Lato, sans-serif; font-size: 14px;">        <img alt="Reduce development time" src="/image/data/Saved/real-time-tracking.jpg" style="box-sizing: border-box; border: 0px; vertical-align: middle; max-width: 100%;" /></div><div class="col-lg-6 col-md-6 col-sm-12 col-xs-12" style="box-sizing: border-box; position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; float: left; width: 570px; font-family: Lato, sans-serif; font-size: 14px;">        <h1 style="box-sizing: border-box; font-size: 30px; margin: 0px 0px 15px; font-family: &quot;Open Sans&quot;, Arial, sans-serif; color: rgb(0, 0, 0); padding: 0px; letter-spacing: -1px;">                Полный контроль при помощи SMS команды</h1>        <div class="txt" style="box-sizing: border-box; margin-top: 35px; font-size: 18px; line-height: 36px; color: rgb(102, 102, 102);">                В современном мире очень важно быть мгновенно в курсе тех перемещения объекта которые происходят в настоящий момент здесь и сейчас, в некоторых случаях не все GSM трекеры удовлетворяет потребностям отслеживать в реальном времени, в данном случае Вы можете отследить онлайн все перемещения объекта ежеминутно. Специальный датчик GPS отправляет частые сигналы Так что место и время перемещения фиксируются постоянно онлайн.</div></div></div><p>   <br></p>

///////////////////////
<div class="col-lg-push-6 col-md-6 col-sm-12 col-xs-12 text-center" style="box-sizing: border-box; text-align: center; position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; float: left; width: 570px; left: 570px; font-family: Lato, sans-serif; font-size: 14px;">        <img alt="How it works?" src="/image/data/Saved/motion300k.jpg" style="box-sizing: border-box; border: 0px; vertical-align: middle; max-width: 100%;" /></div><div class="col-lg-pull-6 col-md-6 col-sm-12 col-xs-12" style="box-sizing: border-box; position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; float: left; width: 570px; right: 570px; font-family: Lato, sans-serif; font-size: 14px;">        <h1 style="box-sizing: border-box; font-size: 30px; margin: 0px 0px 15px; font-family: &quot;Open Sans&quot;, Arial, sans-serif; color: rgb(0, 0, 0); padding: 0px; letter-spacing: -1px;">                Трекер реагирует на движение и сигнализирует</h1>        <div class="txt" style="box-sizing: border-box; margin-top: 35px; font-size: 18px; line-height: 36px; color: rgb(102, 102, 102);">                Например если он услышит какой-либо  звук или прочую активность он немедленно сообщить вам об этом, посредством отправки SMS сообщения на ваш телефон. И вы будете знать, что происходит какая-то активности, вам нужно удостовериться в том что все сохранности .</div></div>

 

[pimur]

22 минуты назад, Android сказал:

Есть 2 блока они криво https://gyazo.com/8a59be1e3d79b7b5dba0cd4941eb19a8 отображаются, если вставить их в описание товара, нужно что бы они не рушили верстку и нормально отображались на мобильной и десктопной.

 

<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 text-center" style="box-sizing: border-box; text-align: center; position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; float: left; width: 570px; font-family: Lato, sans-serif; font-size: 14px;">        <img alt="Reduce development time" src="/image/data/Saved/real-time-tracking.jpg" style="box-sizing: border-box; border: 0px; vertical-align: middle; max-width: 100%;" /></div><div class="col-lg-6 col-md-6 col-sm-12 col-xs-12" style="box-sizing: border-box; position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; float: left; width: 570px; font-family: Lato, sans-serif; font-size: 14px;">        <h1 style="box-sizing: border-box; font-size: 30px; margin: 0px 0px 15px; font-family: &quot;Open Sans&quot;, Arial, sans-serif; color: rgb(0, 0, 0); padding: 0px; letter-spacing: -1px;">                Полный контроль при помощи SMS команды</h1>        <div class="txt" style="box-sizing: border-box; margin-top: 35px; font-size: 18px; line-height: 36px; color: rgb(102, 102, 102);">                В современном мире очень важно быть мгновенно в курсе тех перемещения объекта которые происходят в настоящий момент здесь и сейчас, в некоторых случаях не все GSM трекеры удовлетворяет потребностям отслеживать в реальном времени, в данном случае Вы можете отследить онлайн все перемещения объекта ежеминутно. Специальный датчик GPS отправляет частые сигналы Так что место и время перемещения фиксируются постоянно онлайн.</div></div></div><p>   <br></p>

///////////////////////
<div class="col-lg-push-6 col-md-6 col-sm-12 col-xs-12 text-center" style="box-sizing: border-box; text-align: center; position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; float: left; width: 570px; left: 570px; font-family: Lato, sans-serif; font-size: 14px;">        <img alt="How it works?" src="/image/data/Saved/motion300k.jpg" style="box-sizing: border-box; border: 0px; vertical-align: middle; max-width: 100%;" /></div><div class="col-lg-pull-6 col-md-6 col-sm-12 col-xs-12" style="box-sizing: border-box; position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; float: left; width: 570px; right: 570px; font-family: Lato, sans-serif; font-size: 14px;">        <h1 style="box-sizing: border-box; font-size: 30px; margin: 0px 0px 15px; font-family: &quot;Open Sans&quot;, Arial, sans-serif; color: rgb(0, 0, 0); padding: 0px; letter-spacing: -1px;">                Трекер реагирует на движение и сигнализирует</h1>        <div class="txt" style="box-sizing: border-box; margin-top: 35px; font-size: 18px; line-height: 36px; color: rgb(102, 102, 102);">                Например если он услышит какой-либо  звук или прочую активность он немедленно сообщить вам об этом, посредством отправки SMS сообщения на ваш телефон. И вы будете знать, что происходит какая-то активности, вам нужно удостовериться в том что все сохранности .</div></div>

 

зачем стили в виде падингов и фиксированной ширины к ним?

Змінено 18 липня 2017 користувачем pimur

[Android]

Честно сказать я 0 в плане верстки, просто скопировал пару блоков, буду признателен если кто не будь поможет исправить.

[HyperLabTeam]

1 час назад, Android сказал:

Честно сказать я 0 в плане верстки, просто скопировал пару блоков, буду признателен если кто не будь поможет исправить.

удаляем инлайновые стили и все прописываем в файле css
без фикс значений для ширины и высоты
а вообще проще ссылку на сайт, чтоб на месте смотреть

[pimur]

Тоже сначала порыв возник помочь, но без ссылки сложнее понять. Пс, автору если надо там делов папу минут напишите ЛС, я напишу Вам верную разметку html и css.

Отправлено через Tapatalk

[Android]

tracker24-gps.ru