bems

Проблема такая. Отказались от table, используем divы и свойство block:inline-block. Если div'у не давать class а прописывать все свойства в style, то везде всё номально. Но как только мы создаём в CSS определённый стиль и прописываем его диву в class="имя стиля", то у браузера Chrome возникает такая проблема. Берутся непонятные отступы. Как должно быть (в остальных браузерах) Хром Сам стиль таков: .block-text-content { padding:5px; background-color:#bfbfbf; display: inline-block; font-family: tahoma, verdana, arial, sans-serif, Lucida Sans; font-size: 11px; word-wrap: break-word; overflow: auto; vertical-align:top; } Фрагмент html: <div style="display: inline-block;"> //аватарка </div> <div class="block-author-content" style="padding:2px; height: 46px; width: 513px;"> //информация о блоге </div> Помогите разобраться, что за тупость с хромом? В остальных всё нормально работает!

Спасибо, помогло! Как правило над самыми тупыми ошибками мучаюсь хрен знает сколько. Извините, что насорил.

Пробовал - не помогает.

<a href="" style="display:inline-block; width:200px; height:50px; background-color:#CC0000;">test1</a> <a href="" style="display:inline-block; width:200px; height:50px; background-color:#990000;">test2</a> Буду краток. Реально вообще в этом случае избавиться от отступа? Чтобы ссылки шли вплотную. DIVы не предлогать, не катит. Если можно то как? Заранее спасибо.

Да говорю же, отступы берутся не пойми откуда если писать inline-block для <a>:

Наконец разобрался как надо всё это дело правильно делать, благодаря вашему варианту, но теперь столкнулся с такой проблемой. Кабинет пользователя у нас выполнен тоже в таком стиле, только ссылки все не вертикально расположены, а горизонтально-вертикально. Тоесть три блока в строку, выглядеть это должно вот так: Но это неправильной вариант с divaми с ссылках, который так же глючит на firefox. Я решил его переделать по такому же принципу как вы мне дали: <a class="cabinet-link-0" href="{link_project}"> <span class="img"><img src="{image_project}" height="50" width="50" border="0"></span> <span style="padding-left:3px;display:block;" class="font-block-usertop-title"><b>{name_project}</b></span> <span style="padding-left:3px;display:block;" class="font-block-usertop-content">{info_project}</span> </a> <a class="cabinet-link-1" href="{link_blog}"> <span class="img"><img src="{image_blog}" height="50" width="50" border="0"></span> <span style="padding-left:3px;display:block;" class="font-block-usertop-title"><b>{name_blog}</b></span> <span style="padding-left:3px;display:block;" class="font-block-usertop-content">{info_blog}</span> </a> <a class="cabinet-link-0" href="{link_lesson}"> <span class="img"><img src="{image_lesson}" height="50" width="50" border="0"></span> <span style="padding-left:3px;display:block;" class="font-block-usertop-title"><b>{name_lesson}</b></span> <span style="padding-left:3px;display:block;" class="font-block-usertop-content">{info_lesson}</span> </a> И так далее. Единственное отличие от того стиля, что я сделал в Топе пользователей, как вы мне показали, это то что в display вместо block я поставил inline-block, чтобы блоки шли в строчку по горизонтали. Но между ними начали появляться отступы пикселей в пять. Я уж там все свойства перебрал, и им в dive, в котором они находятся поставил и margin и padding по нулю - всё бесполезно. Потом я решил их сделать обычными блоками, то есть опять превратить из inline-block в block и засовывать их уже в div inline блоки. Но результат тот же. Разве что теперь вниз они без отступов друг за другом идут, а вправо - опять отступ пикселей в пять. Вот так вот выглядит: Помогите решить проблему!

CSS писал не я, если поменять DIV и A местами - разницы никакой, всё так же. Самое главное если так вообще не должно работать, почему же у него всё работает на всех браузерах включая firefox? У меня так же на всех работает, только кроме firefox, причём меня смущает тот факт что ладно бы он вообще не работал. А он работает, но только каждый раз выкидывает парочку нерабочих их них, причём каждый раз разные.

Суть такова. Делаем портал на php с одним человеком. Дизайн разработал я, а верстал он. Но мы оба не профессионалы в этом деле и так как я пользуюсь браузером Firefox, а он - Opera, то у нас сразу выяснилось много проблем. И вот одна из них, которую мы просто наглухо не можем решить. Дело вот в чём. Разрабатываем топ юзеров, ну блок такой сбоку. Выглядит он примерно так: При наведении курсора на каждый блок он весь как ссылка отображаться должен. То есть не только на текст ника или аватарку, а вообще ка каждый отдельный блок курсор наводишь, он цвет немного меняет и как ссылка отображается. Их CSS таков: .usertop-block-0 { font-family: tahoma, verdana, arial, sans-serif, Lucida Sans; font-size: 12px; color: #3e3e3e; display: block; padding: 0px; background-color: #cecece; border-top: 1px solid #ededed; border-bottom: 1px solid #868686; border-left: 1px solid #ededed; border-right: 1px solid #868686; text-decoration: none; margin: 0px; } .usertop-block-0:hover { font-family: tahoma, verdana, arial, sans-serif, Lucida Sans; font-size: 12px; color: #3e3e3e; display: block; padding: 0px; background-color: #dcdcdc; border-top: 1px solid #ededed; border-bottom: 1px solid #868686; border-left: 1px solid #ededed; border-right: 1px solid #868686; text-decoration: none; } .usertop-block-1 { font-family: tahoma, verdana, arial, sans-serif, Lucida Sans; font-size: 12px; color: #3e3e3e; display: block; padding: 0px; background-color: #b4b4b4; border-top: 1px solid #ededed; border-bottom: 1px solid #868686; border-left: 1px solid #ededed; border-right: 1px solid #868686; text-decoration: none; margin: 0px; } .usertop-block-1:hover { font-family: tahoma, verdana, arial, sans-serif, Lucida Sans; font-size: 12px; color: #3e3e3e; display: block; padding: 0px; background-color: #c2c2c2; border-top: 1px solid #ededed; border-bottom: 1px solid #868686; border-left: 1px solid #ededed; border-right: 1px solid #868686; text-decoration: none; } Ну 1 и 0 отличаются только по цвету как идут - светло серый - темно серый. Теперь сам html код вывода таков: <a style="text-decoration: none;" href="http://nullbox.ru/user1"><div class="usertop-block-0"><div> <div style="display: inline-block; width: 50px;"><img src="http://nullbox.ru/ava/ava_1.jpg" height="50" width="50" border="0"></div> <div style="display: inline-block; padding:2px; vertical-align: top"> <b>Maldanii</b> </div> </div></div> </a> <a style="text-decoration: none;" href="http://nullbox.ru/user38"><div class="usertop-block-1"><div> <div style="display: inline-block; width: 50px;"><img src="http://nullbox.ru/ava/ava_38.jpg" height="50" width="50" border="0"></div> <div style="display: inline-block; padding:2px; vertical-align: top"> <b>Mypuk</b> </div> </div></div> </a> <a style="text-decoration: none;" href="http://nullbox.ru/user3"><div class="usertop-block-0"><div> <div style="display: inline-block; width: 50px;"><img src="http://nullbox.ru/ava/ava_3.gif" height="50" width="50" border="0"></div> <div style="display: inline-block; padding:2px; vertical-align: top"> <b>Drelariel</b> </div> </div></div> </a> И так далее. Но в чём проблема. Дело в том что в браузерах Opera и Chrome всё друг за другом отображается без проблем - все ссылки-блоки рабочие. Но у меня Firefox постоянно про обновлении страниц пара-вторая ссылок оказываются нерабочими, тоесть просто при наведении на блок, курсор на руку не меняется и он отказывается отображаться как ссылка. Уже что только не делали - всё бесполезно. Причём, если в блоке убрать текст и оставить одну картинку с аватаром - всё нормально - все ссылки всегда работают. Но как только добавляется текст - Firefox упорно каждый раз пару блоков ссылками не делает. Причём каждый раз разные и разное кол-во! Может все нормально вывести, может один только упустить,а может вообще штук пять! Каждый раз новые! Что такое? Я просто ничего не понимаю! Почему только в Firefox так? Сменить браузер не советуйте - пользователям это глупо будет говорить, хотим чтоб везде по-нормальному работало, но не можем найти проблему. Помогите, очень прошу! Или хотя бы посоветуйте что нибудь или скажите, отчего такое может быть? Чтобы вам легче представить картину было вот вам скрин самой проблемы в Firefox'e. Три раза обновил страницу - три случайных вывода. Как раз там где ники пользователей отобразились синим цветом - блок-ссылка не работает, а перейти по ссылке получается только если навести курсор на сам текст.