Думаю написанная, озвученная мысль дает более содержательно изучить вопрос…

Задача: — сдать Joomla — сайт.
Возникшая проблема — запросы заказчика вышли за рамки выбранного шаблона.

Шаблон можно посмотреть по ссылке — http://musikant.com.ua/dom2

Конкретизирую — при кустомизации шаблона выползает много разных бяк в IE.
В нормальном браузере все зашибись.

Ответ готов!

Вот очередная бяка:



А вот нормально не «заползая» под слой таже менюха:



Начну играться для начала с z-index…

Спустя время...
Значит проверил z-index — не сработало.
Добавил отредактировал свойство overflow:visible;
Отображается все содержание элемента, даже за пределами установленной высоты и ширины.
не помогло(

Спустя время...2
Значит восстанавливаю по памяти обжованый шаблон)) оперативной памяти уже не хватает. ЕСТЬ МЕГА ИДЕЯ И МЕГА ДОДУМКА!.. но боюсь обмаламаться. После гугления обнаружил, что у IE есть такая особенность — z-index для него это пустое место — для него главное последовательность расположенных div'ов. Теперь задача — надо как-то исхитриться, чтобы нижний div был в первых рядах(последние идут сверху слоями)
Код после обрезки:

<div id="main_bg">
    <div id="h_area">
       <div id="top_menu">
          <div id="topnav"></div>
          <div id="user4">user4</div>
       </div>
       <div id="main_top" class="banner">top</div>
    </div>
    <div id="leftcolumn">
    </div>
    <div id="maincolumn>
       <div class="path">breadcrumb</div>
       <div class="nopad">component</div>
    </div>
    <div id="rightcolumn">
       <div align="center">syndicate</div>
    </div>

   </div>    
    
   <div id="f_area">
   </div>

</body>
</html>

Устал… надо отвлечся)

Продолжаю:

Отдельно проблемное место:

<div id="h_area">
       <div id="top_menu">
          <div id="topnav"></div>
          <div id="user4">user4</div>
       </div>
       <div id="main_top" class="banner">top</div>
    </div>

Блин код из фаербага:



Теперь надо поиграться с:

        position: relative; /* Относительное позиционирование */
        float: left; /* Совмещение колонок по горизонтали */
        left: 0px; /* Сдвиг слоя влево */
        top: 200px; /* Смещение слоя вниз */ 

Надеялся на:

    <div id="h_area">
       <div id="main_top" class="banner">top</div>
       <div id="top_menu">
          <div id="topnav"></div>
          <div id="user4">user4</div>
       </div>
    </div>

Я СПРАВИЛСЯ!!!)))
Значит рассказываю как все вышло:

1. Чтобы IE не возмущался, разместил div'ы в порядке увеличения z-index'a. Z-index проставил тоже. Но если для нормального браузера они имеют значение, то в 6-м экспоэре, который у меня — ИГРАЛО РОЛЬ И «правильное» расположение дивов и начиличе з-индекса.

Теперь немного кодов использовано при кустомизации)):

position: relative; /* Абсолютное позиционирование */
/*        left: 350px; /* Положение левого края */
        top: -250px; /* Положение верхнего края */
/*        width: 120px; /* Ширина слоя */

Слева и длину менять не пришлось.

ну и зэттттт

z-index:10;

Вывод №2. При небольшом разборе такого цсс все-таки подпорчен шаблон в ie. Если внимательно присмотреться, то видно аматорские проделки. Вывод таков — не умеешь верстать — лучше не браться — убиться можно!

В общем господа пожалуйста!
Да и хотелось бы комментариев на один вопрос — при разборе готового css заметил, что ie реагирует по особенному на закоменчивание (/*). Если нормальный браузер комментит строку кода, то ie ведет себя непристойно. Если нетрудно, то просвятите.