ФорумРазработкаКлиентская сторонаВерстка и оформление → смешение блоков в ie 6.0 в остальных нормально все

смешение блоков в ie 6.0 в остальных нормально все

  • ArhiISP

    Сообщения: 15 Репутация: N Группа: Кто попало

    Spritz Окт. 28, 2010, 2:19 п.п.

    добрый вечер.
    есть дизайн http://wooohooo.ru/
    состоящий из 3х блоков, во всех браузерах все хорошо, а вот в ие 6.0 блоки как попало располагаются, правый улетает внизу, левый залазит на центральный никак не пойму в чем проблема.
    в заранее благодарен за помощь.


    css

        /**
         * Global elements
         */
    
    	 
        body {
            color       : #454545;
            background  : #FFFFFF;
            font-family : Verdana, Arial, Helvetica, sans-serif;
            font-size   : 0.75em;
    		text-align:center;
        }
    	
    	#wrap {
    		width:960px;
    		text-align:left;
    		margin:0 auto;
    		background: #F7F5F5;
    		position : relative;
    		margin-top:20px;
    
    	}
    	
    	#top {
    		margin:0 auto;
    		width:1000px;
    		height:20px;
    		background    : url(../images/top.gif) no-repeat 0px center #F5F9FB;
    		text-align:right;
    		color      : #000000;
            font-size  : 0.8em;
    
    	}
    	
    
        h1 { font-size : 1.7em; margin-top : 0; }
        h2 { font-size : 1.5em; }
        h3 { font-size : 1.3em; }
        h4 { font-size : 1.1em; }
        h5 { font-size : 1.0em; }
        h1, h2, h3, h4, h5 { font-family : Georgia, serif; color : #f22; }
    
        img { border : 0; }
        form { margin : 0; }
    
        a       { color : #f22; background : none; text-decoration : underline; }
        a:hover { color : #fff; background : #f22; text-decoration : none; }
    
    
        /**
         * Setup the 3 column layout
         */
    
        body { margin : 0; padding : 0 0px; min-width : 0px; }
    
        #header, #footer, #nav { margin : 0 0px 0 0px;}
    
    
        .column            { float : left; position : relative; }
        #content-container { width : 660px;  margin-left :150px;background : #F7F5F5; }
        #left-container    { width : 150px; margin-left : -660px; right : 150px;background : #F7F5F5; }
        #right-container   { width : 150px; margin-right : 0px; background : #F7F5F5;}
    
        #footer { clear : both; }
    
        * html #left-container { left : 0px; }
    
    
        /**
         * Style the main page areas
         */
        #header {
            background    : url(../images/logo.gif) no-repeat 0px center #FFFFFF;
            height        : 90px;
    		text-align:right;
    		margin:0 auto;
    		width:1000px;
    
        }
        #header img { display : none; }
    
        #content-container { background : #F7F5F5; }
    
        #content {
    
            padding     : 10px;
            line-height : 1.8em;
        }
    
        #breadcrumbs {
            font-size : 0.8em;
            color     : #ccc;
            margin-bottom : 10px;
        }
    
        #breadcrumbs a { color : #aaa; }
        #breadcrumbs a:hover { background : #aaa; color : #fff; }
    
        #left-container .box, #right-container .box {
            margin      : 0 10px 10px 10px;
            padding     : 10px;
            border      : 1px solid #eee;
            background  : #CBCACA;
            font-size   : 0.9em;
            line-height : 1.6em;
        }
    
        #footer {
            color      : #7C7C7C;
            font-size  : 0.8em;
    		width		:960px;
    		text-align:center;
    		margin:0 auto;
            background    : url(../images/footer.gif) no-repeat 0px center #fff;
            height        : 25px;
    		
        }
    
    	#footer .footleft{
    		text-align:left;
    		float: left;
            margin: 5px 0px 0px 10px;
        }
    	#footer .footright{
    		text-align:right;
    		float: right;
            margin: 5px 10px 0px 0px;
        }
    	
    	#top .topright{
    		text-align:center;
            margin: 0px 20px 0px 0px;
    		color:#7C7C7C;
        }
    	
    	#topmenu{
    		text-align:left;
    		float: left;
            margin: 15px 0px 0px 0px;
    
    
        }
    	
    	#lmenuf{
    		text-align:left;
    		float: left;
            margin: 15px 0px 0px 40px;
    		height:22px;
    		width:10px;
            background    : url(../images/lmenuf.gif) no-repeat;
        }
    	
    	#rmenuf{
    		text-align:left;
    		float: left;
            margin: 15px 0px 0px 0px;
    		height:22px;
    		width:10px;
            background    : url(../images/rmenuf.gif) no-repeat;
        }
    	
    	
    	
    	#search2{
    		text-align:right;
    		float: right;
            margin: 17px 30px 0px 0px;
        }



    шаблон разметки


    <!DOCTYPE html 
    	PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml" lang="ru" xml:lang="ru"> 
    
    <head> 
        <title>{$title|escape} </title> 
    	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    
         <link rel="stylesheet" href="/css/styles.css" type="text/css" media="all" />
     		
    </head> 
    
    <body> 
    <div id="top">
    		<div class="topright">
    		</div>
    </div>
    
    <div id="header"></div>
    	<div id="nav">
    	<div id="lmenuf"></div>
    		<div id="topmenu">
                    пункты меню
    		</div>
    		<div id="rmenuf"></div>
    		<div id="search2">
                    поиск
    		</div>		
    	</div>
    
    <div id="wrap">
    	
            <div id="content-container" class="column">
                <div id="content">
                    <div id="breadcrumbs">
                        пути
                    </div>
                    <h1>
    заголовок
                    </h1>
    
    
    
    
    
    
                </div>
            </div>
    		
    		<div id="left-container" class="column">
    		
    			<div class="vneshniy-box">
    					<div class="zagolovok-box">
    							<div class="zagolovok-plus-box">
    								Контакты:
    							</div>
    					</div>
    					<div class="content-boxsmall">
    					<h4>Поддержка: </h4> 
    					<h4>Предложения: </h4> 
                </div>	
                </div>			
    	    
    
    		</div>
    		
    		<div id="right-container" class="column">
    				
    			<div class="vneshniy-box">
    					<div class="zagolovok-box">
    							<div class="zagolovok-plus-box">
    								Кабинет
    							</div>
    					</div>							
    					<div class="content-box">
    
    			</div>
    			</div>
    
    		</div>	
    </div>		
    <div id="footer">
    	<div class="footleft">Copyright © 2010  Все права защищены. Копирование запрещено.</div>
    	<div class="footright"> </div>
    </div>
    	</body>
    </html>

  • Абырвалг

    Сообщения: 6480 Репутация: N Группа: Джедаи

    Spritz Окт. 28, 2010, 2:20 п.п., спустя 57 секунд

    забей на ие6
  • ArhiISP

    Сообщения: 15 Репутация: N Группа: Кто попало

    Spritz Окт. 28, 2010, 2:25 п.п., спустя 5 минут 15 секунд

    ну это понятно, что уже почти никто не использует, но все же встречаются еще…
    да уже и интересно, что с ним не так, что все так разъезжается….
  • Абырвалг

    Сообщения: 6480 Репутация: N Группа: Джедаи

    Spritz Окт. 28, 2010, 2:41 п.п., спустя 15 минут 43 секунды

    да ну и хуй с ним. Направь эти усилия на что-то более полезное
  • truth4oll

    Сообщения: 463 Репутация: N Группа: Адекваты

    Spritz Окт. 28, 2010, 3:07 п.п., спустя 26 минут 26 секунд

    Оставлять как есть не стоит, не кошерно, а вот заглушку для ИЕ6 поставить можно,
    с красиво оформленным ссылками на скачку современных браузеров
  • Hight

    Сообщения: 1489 Репутация: N Группа: Адекваты

    Spritz Окт. 28, 2010, 5:38 п.п., спустя 2 часа 30 минут 57 секунд

    забей на ие6

    хуй с ним

    + 1
  • ArhiISP

    Сообщения: 15 Репутация: N Группа: Кто попало

    Spritz Окт. 28, 2010, 9:15 п.п., спустя 3 часа 36 минут 41 секунду

    выложу скрин, как выглядит.
  • Givi

    Сообщения: 2284 Репутация: N Группа: Адекваты

    Spritz Окт. 28, 2010, 11:43 п.п., спустя 2 часа 28 минут 10 секунд

    ArhiISP, или забей на 6-ого осла или плати деньгу, и тебе сверстают макет так, чтоб он везде отображался правильно.
    Спустя 41 сек.
    а, ну да. или верстай таблицами, они во времена "правления" ИЕ6 были очень актуальны в плане составления каркаса страницы.
  • technobulka

    Сообщения: 4540 Репутация: N Группа: Джедаи

    Spritz Окт. 29, 2010, 12:17 д.п., спустя 34 минуты 33 секунды

    в лом ковыряццо, но косяк где-то здесь
    #left-container { width : 150px; margin-left : -660px; right : 150px; background : #F7F5F5; }

    и конечно же

    забей на ие6

    +1
    Высокоуровневое абстрактное говно
  • Trej Gun

    Сообщения: 5305 Репутация: N Группа: в ухо
  • born4burn

    Сообщения: 3 Репутация: N Группа: Кто попало

    Spritz Ноя. 2, 2010, 8:15 д.п., спустя 4 дня 6 часов 51 минуту

    ие 6 по-своему считает margin-left (right) у флоатонутых блоков (часто удваивает отступы). Возможно поможет хак: _display: inline; у блоков с маржинами.

Пожалуйста, авторизуйтесь, чтобы написать комментарий!