CSS для домашней страницы и других страниц opencart

Question

Я работаю над мобильной версией нашего веб-сайта с помощью Media Queries, но у меня возникают некоторые странные проблемы с CSS.

Я сделал домашнюю полностью реагирующий на мобильном устройстве (< 480px), и это выглядит хорошо для меня:

Сейчас я работаю на второй странице (tuinontwerp) Эта страница использует те же блоки, как на главной странице, но CSS отличается:

Как вы можете видеть, коричневые блоки шире, но КСС то же самое. Даже в инспекторе Chrome dev tools это точно то же самое.

Вот мой CSS для блоков:

#diensten-row { 
    width: auto; 
    min-width: 100%; 
    padding: 0; 
    margin: 30px auto 0 auto; 
    height: 120px; 
} 

#diensten-row a{ 
    width: auto; 
    max-width: 100%; 
} 

#diensten { 
    background-color: #996633; 
    color: #fff; 
    line-height: 8px; 
    float: left; 
    margin: 0 auto 30px auto; 
    padding: 0; 
    min-width: 100%; 
    height: 100px; 
    text-align: center; 
    border: 1px solid #fff; 
} 

HTML: (все еще ищет файл, который содержит диву)

Спасибо :)

Answer 1

Так как ширину #diensten-row, #diensten и #diensten-row a - 100%, я предсказываю, что ширина контейнера на странице tuinontwerp немного больше, чем на первой странице.

Также совет: Не используйте ID's более одного раза. Я вижу, что вы используете ID #diensten несколько раз. Используйте для этого класс. ID следует использовать только тогда, когда элемент используется только один раз. Но даже тогда я предпочитаю использовать classes.