Некорректное отображение ячеек в Chrome

@MCHsh · Регистрация: 12.03.2017

Студворк — интернет-сервис помощи студентам

Доброго времени суток!
Прошу помочь разобраться с проблемой.
Заключается она в следующем: при генерации контента на странице, chrome игнорирует bootstrap, и блоки отображаются
не корректно. На мозилле проблем нет, все корректно. Чую, хрому нужно задать дополнительный параметр и все будет ок!
Могу и ошибаться...

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
<div class="jvlastestnews-intro">
<ul class="row jvlastestnews-items ">
 
<li class="col-sm-4 col-xs-4 col-md-4 column0 jvlastestnews-items-item">
    <div class="clearfix">
        <!-- Before title -->       
                <a class="jvlastestnews-items-item-thumbnail-link" href="/index.php/услуги/наше-производство" title="Производство вентиляции">
            <div class="jvlastestnews-items-item-thumbnail jvlastestnews-items-item-thumbnail0" data-title="Производство вентиляции">
                    <img src="/cache/jvlatestnews/original_360_proizvodstvo.jpg" alt="Производство вентиляции" title="Производство вентиляции" />            
            </div> 
        </a>
                
        <div class="jvlastestnews-items-item-box">
            <!-- Title -->   
                            <h3 class="jvlastestnews-items-item-title">       
                                            <a class="intro-title" href="/index.php/услуги/наше-производство">
                            Производство вентиляции  
                        </a>     
                                    
                </h3>   
            
            <!-- Published details -->
                    </div>
        
       
        <!-- Content -->
                    <div class="jvlastestnews-items-item-description">Для полного обеспечения потребностей и пожеланий заказчика, а также оптимизации расходов и сроков выполнения работ, компанией «ТНУ - СПЕЦСТ<span class="jvlastestnews-items-item-description-cutstring">...</span></div>
                
        <!-- Readmore -->
                <div class="jvlastestnews-items-item-readmore">
            <a href="/index.php/услуги/наше-производство" title="Подробнее">
                <span>Подробнее</span>
            </a>
        </div>    
            </div>
</li>
 
 
<li class="col-sm-4 col-xs-4 col-md-4 column1 jvlastestnews-items-item">
    <div class="clearfix">
        <!-- Before title -->       
                <a class="jvlastestnews-items-item-thumbnail-link" href="/index.php/услуги/проектирование" title="Проектирование систем вентиляции">
            <div class="jvlastestnews-items-item-thumbnail jvlastestnews-items-item-thumbnail1" data-title="Проектирование систем вентиляции">
                    <img src="/cache/jvlatestnews/original_360_proektirovanie.jpg" alt="Проектирование систем вентиляции" title="Проектирование систем вентиляции" />            
            </div> 
        </a>
                
        <div class="jvlastestnews-items-item-box">
            <!-- Title -->   
                            <h3 class="jvlastestnews-items-item-title">       
                                            <a class="intro-title" href="/index.php/услуги/проектирование">
                            Проектирование систем вентиляции  
                        </a>     
                                    
                </h3>   
            
            <!-- Published details -->
                    </div>
        
       
        <!-- Content -->
                    <div class="jvlastestnews-items-item-description">Компания «ТНУ СПЕЦСТРОЙ» предлагает услуги по проектированию вентиляционных систем любой сложности в Астане и Казахстане. Разработка проект<span class="jvlastestnews-items-item-description-cutstring">...</span></div>
                
        <!-- Readmore -->
                <div class="jvlastestnews-items-item-readmore">
            <a href="/index.php/услуги/проектирование" title="Подробнее">
                <span>Подробнее</span>
            </a>
        </div>    
            </div>
</li>
 
 
<li class="col-sm-4 col-xs-4 col-md-4 column2 jvlastestnews-items-item">
    <div class="clearfix">
        <!-- Before title -->       
                <a class="jvlastestnews-items-item-thumbnail-link" href="/index.php/услуги/очистка-и-дезинфекция" title="Очистка и дезинфекция">
            <div class="jvlastestnews-items-item-thumbnail jvlastestnews-items-item-thumbnail2" data-title="Очистка и дезинфекция">
                    <img src="/cache/jvlatestnews/original_360_ochistka.jpg" alt="Очистка и дезинфекция" title="Очистка и дезинфекция" />            
            </div> 
        </a>
                
        <div class="jvlastestnews-items-item-box">
            <!-- Title -->   
                            <h3 class="jvlastestnews-items-item-title">       
                                            <a class="intro-title" href="/index.php/услуги/очистка-и-дезинфекция">
                            Очистка и дезинфекция  
                        </a>     
                                    
                </h3>   
            
            <!-- Published details -->
                    </div>
        
       
        <!-- Content -->
                    <div class="jvlastestnews-items-item-description"> Здоровье, работоспособность, да и просто самочувствие человека в значительной степени определяется условиями микроклимата окружающей среды<span class="jvlastestnews-items-item-description-cutstring">...</span></div>
                
        <!-- Readmore -->
                <div class="jvlastestnews-items-item-readmore">
            <a href="/index.php/услуги/очистка-и-дезинфекция" title="Подробнее">
                <span>Подробнее</span>
            </a>
        </div>    
            </div>
</li>
 
 
<li class="col-sm-4 col-xs-4 col-md-4 column0 jvlastestnews-items-item">
    <div class="clearfix">
        <!-- Before title -->       
                <a class="jvlastestnews-items-item-thumbnail-link" href="/index.php/услуги/монтаж" title="Монтаж вентиляции">
            <div class="jvlastestnews-items-item-thumbnail jvlastestnews-items-item-thumbnail3" data-title="Монтаж вентиляции">
                    <img src="/cache/jvlatestnews/original_360_montazh.jpg" alt="Монтаж вентиляции" title="Монтаж вентиляции" />            
            </div> 
        </a>
                
        <div class="jvlastestnews-items-item-box">
            <!-- Title -->   
                            <h3 class="jvlastestnews-items-item-title">       
                                            <a class="intro-title" href="/index.php/услуги/монтаж">
                            Монтаж вентиляции  
                        </a>     
                                    
                </h3>   
            
            <!-- Published details -->
                    </div>
        
       
        <!-- Content -->
                    <div class="jvlastestnews-items-item-description"> «Экономика должна быть экономной», с этими словами трудно спорить, в том числе, говоря о монтаже вентиляционных систем. Профессиональный м<span class="jvlastestnews-items-item-description-cutstring">...</span></div>
                
        <!-- Readmore -->
                <div class="jvlastestnews-items-item-readmore">
            <a href="/index.php/услуги/монтаж" title="Подробнее">
                <span>Подробнее</span>
            </a>
        </div>    
            </div>
</li>
 
 
</ul></div>
 
                 
            </div>
            
        
             
        </div>
             
     
         
    </div>
    
            </div> 
        </div>  
    </div>

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
element.style {
    animation-iteration-count: 1;
    animation-duration: 1500ms;
    animation-delay: 0ms;
}
@media (min-width: 768px)
bootstrap.min.css:7
.col-md-4 {
    width: 33.33333333%;
}
@media (min-width: 768px)
bootstrap.min.css:7
.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
    float: left;
}
@media (min-width: 768px)
bootstrap.min.css:7
.col-sm-4 {
    width: 33.33333333%;
}
@media (min-width: 768px)
bootstrap.min.css:7
.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
    float: left;
}
bootstrap.min.css:7
.col-xs-4 {
    width: 33.33333333%;
}
bootstrap.min.css:7
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
    float: left;
}
bootstrap.min.css:7
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
}
update.css:96
body *, #block-mainnav .jv-module ul.fxmenu a {
    text-transform: initial !important;
}
core-template.css:67
* {
    margin: 0;
    padding: 0;
    outline: none !important;
}
bootstrap.min.css:7
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
user agent stylesheet
li {
    display: list-item;
    text-align: -webkit-match-parent;
}
Inherited from ul.row.jvlastestnews-items
template.css:5425
ul, ol {
    list-style: none;
}
update.css:96
body *, #block-mainnav .jv-module ul.fxmenu a {
    text-transform: initial !important;
}
user agent stylesheet
ul, menu, dir {
    display: block;
    list-style-type: disc;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-start: 40px;
}
Inherited from div.jvlastestnews-intro
update.css:96
body *, #block-mainnav .jv-module ul.fxmenu a {
    text-transform: initial !important;
}
Inherited from div.jvlatestnews-content
update.css:96
body *, #block-mainnav .jv-module ul.fxmenu a {
    text-transform: initial !important;
}
Inherited from div.jvlatestnews-container.default.jvlastestnews-service
update.css:96
body *, #block-mainnav .jv-module ul.fxmenu a {
    text-transform: initial !important;
}
Inherited from div#jvlatestnews350.jvlatestnews.default
update.css:96
body *, #block-mainnav .jv-module ul.fxmenu a {
    text-transform: initial !important;
}
Inherited from div.contentmod.clearfix
update.css:96
body *, #block-mainnav .jv-module ul.fxmenu a {
    text-transform: initial !important;
}
Inherited from div.container
update.css:96
body *, #block-mainnav .jv-module ul.fxmenu a {
    text-transform: initial !important;
}
Inherited from div.jv-module.module.jvlastestnews-service
update.css:96
body *, #block-mainnav .jv-module ul.fxmenu a {
    text-transform: initial !important;
}
Inherited from section#full-site
update.css:96
body *, #block-mainnav .jv-module ul.fxmenu a {
    text-transform: initial !important;
}
Inherited from div.z-index-top
update.css:96
body *, #block-mainnav .jv-module ul.fxmenu a {
    text-transform: initial !important;
}
Inherited from div#mainsite
update.css:96
body *, #block-mainnav .jv-module ul.fxmenu a {
    text-transform: initial !important;
}
Inherited from div#wrapper
update.css:96
body *, #block-mainnav .jv-module ul.fxmenu a {
    text-transform: initial !important;
}
Inherited from body.layout-default.ltr.home.home-1.body-bg-24.body-wide.blue
index.php:188
body {
    font-family: 'Scada', serif;
}
index.php:187
body {
    font-family: 'Montserrat', serif;
}
template.css:932
body {
    background-color: #f5f5f5;
    /* color: #666666; */
    color: #22252d;
    font-family: sans-serif;
    font-size: 16px;
    line-height: 1.8;
    background-repeat: repeat;
    background-position: top left;
    background-attachment: scroll;
}
core-template.css:72
body {
    font: 14px/18px Arial, sans-serif;
    font-size: ;
    color: #333;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
bootstrap.min.css:7
body {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 14px;
    line-height: 1.42857143;
    color: #333;
    background-color: #fff;
}
Inherited from html.js.csstransforms.csstransforms3d.csstransitions
template.css:928
html {
    font-size: 62.5%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
bootstrap.min.css:7
html {
    font-size: 62.5%;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
bootstrap.min.css:7
html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}
Pseudo ::before element
bootstrap.min.css:7
:before, :after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
Pseudo ::after element
bootstrap.min.css:7
:before, :after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
Pseudo ::scrollbar element
template.css:5345
::-webkit-scrollbar {
    width: 10px;
    background-color: #1B273D;
}
Pseudo ::scrollbar-thumb element
style.css:215
::-webkit-scrollbar-thumb {
    background: #4698dd;
}
template.css:5349
::-webkit-scrollbar-thumb {
    background: #ffb600;

@MCHsh · 26.03.2017, 20:48 **[ТС]**

Опытным путем выяснил, что при изменении ширины контейнера все становится ровно.
Но сердце чувствует, что не зря такая верстка.

CSS
1
2
3
4
5
@media (min-width: 1200px)
bootstrap.min.css:7
.container {
    width: 1200px; /*- было 1170px -*/
}

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image 8Observer8 10.02.2026 Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .	Установка Qt-версии Lazarus IDE в Debian Trixie Xfce volvo 10.02.2026 В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .
SDL3 для Web (WebAssembly): Работа со звуком через SDL3_mixer 8Observer8 08.02.2026 Содержание блога Пошагово создадим проект для загрузки звукового файла и воспроизведения звука с помощью библиотеки SDL3_mixer. Звук будет воспроизводиться по клику мышки по холсту на Desktop и по. . .	SDL3 для Web (WebAssembly): Основы отладки веб-приложений на SDL3 по USB и Wi-Fi, запущенных в браузере мобильных устройств 8Observer8 07.02.2026 Содержание блога Браузер Chrome имеет средства для отладки мобильных веб-приложений по USB. В этой пошаговой инструкции ограничимся работой с консолью. Вывод в консоль - это часть процесса. . .	SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве 8Observer8 02.02.2026 Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .	Философия технологии iceja 01.02.2026 На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .