Jump to content
  • 0

Див не фиксируется в эксплорерах...

shokeri

Asked by shokeri,

 Share

Question

shokeri Explorer

shokeri

Posted
Posted

Всем привет :) Может у кого возникнет свежая идея, дело вот в чем.

Вот страничка (стили и код в одном)... во всех браузерах нормально.. ну а в эсплорерах как обычно... проблема в высоте дива (прибавляет автоматически) и правый див (righcol) поднимает наверх, хотя должен быть на 70 px ниже ...

Вот сам код, если у кого есть вариант, буду благодарна.. . я что=то тут застряла..

<!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">
<head>
 <title> </title>
 <meta http-equiv="content-type" content="text/html; charset=windows-1251"/>
 <style type="text/css">


html,body{ margin:0; padding:0; background:#fff; background-repeat:repeat-y;font-family:Tahoma,Arial,Verdana,Sans-Serif; color:#000000; font-size:11px;
width: expression(((document.documentElement.clientWidth || document.body.clientWidth) < 800)? "1000px" : "100%")}
.logo { position:relative; width:80px; margin: 30px 30px 30px 0px;}
.main_block { width:1000px; position:absolute; left:0; top:0; height: 764px; margin:0; padding:0; }
.content_block { padding:10px; background-color:#F4F4F4;}
.frm_block { margin:0 auto; pwidth:300px;}
.img {display:block;}
.clear_small { clear:both; font-size:1px; height:10px; }
.fr {float:right; }
#leftcol { position: absolute; width: 253px; height:914px; left: 1px; background:url(images/mi.gif);); background-repeat:repeat-y; padding: 5px; top: 0;}
#rightcol { position: relative; margin-left: 280px; background: #fff; padding: 0; height:100%; margin-top:70px;}
H1 { margin: 0; }
div.line { height:1px; background:url(images/line.gif); background-repeat: repeat-x;}
.podlo { margin-left:15px; position:relative;margin-right:15px;valign:middle;margin-top:70px; padding-right:12px;}
.welcom { position:relative; margin-top:44px; width:235px; font-family:tahoma; font-size:14px;}
.exit { position:relative; margin-top:-12px; margin-right:0; font-family:tahoma; font-size:11px; font-weight:bold; width:120px;
float:right; }
a.out { font-family:tahoma; font-size:11px; text-decoration:underline; font-weight:bold; color:#000000;}
.liner { height:1px; background:url(images/line.gif); background-repeat: repeat-x; margin-top:17px; position:relative;}
.liner_1 { height:1px; background:url(images/line.gif); background-repeat: repeat-x; margin-top:10px; position:relative;}
.admcenter { position:relative; margin-top:50px; margin-left:0; margin-right:0;}
.admmenul { position:relative; float:left; width:45%; margin:0;}
.admmenur { position:relative; float:right; width:45%; margin:0;}
.zagolovok { position:relative; font-family:Arial, Helvetica; width:175px; font-size:17px; font-weight:bold; color:#000000; float:left;
margin-left:0; }
.zakrito { position:relative; float:right; font-family:tahoma; font-size:11px; color:#c2c2c0; font-weight:bold; text-decoration:underline;
width:50px; margin-top:3px; }
.zagol {position:relative;margin-top:0;margin-left:0;height:20px;}
.action_form {position:relative; height:40px; font-family:Arial; font-size:11px; margin-top:5px;}
.file { position:relative; float:left; width:42%;}
.ok_file { position:relative; float:right; width:41%; margin-right:20px; margin-top:8px; } 
span.left_menu1 { position:relative; width:180px; height:10px;}
a { font-family:Arial; font-size:11px; text-decoration:underline; color:#ffffff; }
.active { font-family:Arial; font-size:11px; text-decoration:none; color:#feb52e; font-weight:bold;}
.menu_3 { position:relative; height:20px; width:140px; padding-top:7px;} 
.podlo1 {margin-left:15px; position:relative;margin-right:15px;valign:middle;margin-top:70px;}
.knopka_ch { position:relative; width:160px; float:right; margin-right:25px; margin-top:4px; }
.adms { position:relative; margin-left:0; margin-top:0; width:314px;} 
.soh { position:relative; margin-left:2px; margin-top:18px;}
.fr1 { float:right; }
.fl1 { float:left; margin-right:5px;}

 </style>
</head>
<body>
<!--[if IE 6]>
<style type="text/css">

.menu_3 {position:relative; height:10px; width:140px; margin-bottom:17px; padding-top:0;}
.action_form { height 5px; padding-top:0; padding-bottom:10; font-family:Arial; font-size:11px;}
#rightcol { position: relative; margin-left: 280px; background: #fff; padding: 0; height:100%; margin-top:70px;}
.soh { position:relative; margin-left:2px; padding-top:18px; z-index:100;}
.ok_file { position:relative; float:right; width:41%; margin-right:20px; margin-top:8px;} 
</style>
<![endif]-->

<!--[if IE 7 ]>
<style type="text/css">
.menu_3 {position:relative; height:20px; width:140px; margin-top:8px; padding-top:0;}
#action_form { height:40px; padding-top:78px; font-family:Arial; font-size:11px;
.rightcol { position: relative; margin-left: 280px; background: #fff; padding: 0; height:100%; padding-top:70px;}

</style>
<![endif]-->

 <div class="main_block">
 <div id="leftcol">
 <div class="logo" style="margin: 30px 30px 30px 50px;"><img src="images/logo.png" alt="Андерсен?" /></div>
 <div class="podlo1" style=" padding-left:4px; padding-right:6px;">
 <div class="menu_3" > <img src="images/strelka.gif" style="margin-right:8px;" /><a href="#" class="active">ГЛАВНАЯ СТРАНИЦА</a> </div>
 <div class="line"></div>
 <div class="menu_3"><img src="images/strelka.gif" style="margin-right:8px;" /><a href="#">КОНТЕНТ</a> </div>
 <div class="line"></div>
 <div class="menu_3" > <img src="images/strelka.gif" style="margin-right:8px;" /><a href="#">НОВОСТИ</a></div>
 <div class="line"></div>
 <div class="menu_3" > <img src="images/strelka.gif" style="margin-right:8px;" /><a href="#">БАННЕРЫ</a></div>
 <div class="line"></div>
 <div class="menu_3" > <img src="images/strelka.gif" style="margin-right:8px;" /><a href="#">ССЫЛКИ</a> </div>
 </div>
 </div>
 <div id="rightcol">
 <div class-"adms"><img src="images/heaad.gif" /></div>
 <div class="welcom">Добро пожаловать, Тихон Сенович</div> 
 <div class="exit">
 <div align="right"><img src="images/strelka.gif" style="margin-right:8px;"/><a href="#" class="out">выход из системы</a></div>
 </div>
 <div class="liner"></div>
 <div class="admcenter">
 <div class="zagolovok">Добавить заголовок</div>
 <div class="admmenur" style="display:inline">

 <div class="zagol">
 <div class="zagolovok">Добавить заголовок</div>
 <div class="zakrito" style="float:right">закрыть</div>
 </div>
 <div class="liner_1"></div>
 <div class="action_form" style="margin-top:10px;"><form action="handler.php">
 <input type="checkbox" name="option1" value="a1" checked>активен <b style="margin-left:5px;">подсказка</b>

 </form></div>
 <div class="action_form"><form action="handler.php">
 <input type="checkbox" name="option1" value="a1" checked>отображать в меню <b style="margin-left:5px;">подсказка</b>

 </form></div> 
 <div class="action_form"><form action="handler.php">Subdivision_Name (in menu)<sup>*</sup>
<input type="text" maxlength="29" size="24"></form> 
 </div> 
 <div class="action_form"><form action="handler.php">Template ID
<select name="temp"><option value="s1">print_version.html</option><option value="s2" selected >galery.html</option><option value="s3">site_map.html</option><option value="s3">about_andersen.html</option></select></form>
 </div>
 <div class="action_form"><form action="handler.php">EnglishName (mod_rewrite)<sup>*</sup>
<input type="text" maxlength="29" size="24"></form> 
 </div>
 <div class="action_form"><form action="handler.php">external link
<input type="text" maxlength="29" size="24"></form> 
 </div>
 <div class="action_form" >
 <div class="fl1" ><form action="handler.php">Pic (on menu)
<input type="text" maxlength="29" size="24"></form></div><img src="images/chfail.gif" style=" margin-right:30px; margin-top:7px;"> </div>
 <div class="action_form"><form action="handler.php">
 <div class="fl1" align="left">Description (meta)

 <input type="text" maxlength="29" size="24">
 </div>
 </form> 
 </div>
 <div class="action_form"><form action="handler.php">Keywords (meta)
<input type="text" maxlength="29" size="24"></form> 
 </div>
 <div class="soh"><img src="images/save.gif" width="109" height="30" /></div>

 </div>

 </div> 

 </div>

/div>

 </div>

</body>
</html>

Link to comment
Share on other sites

29 answers to this question

Recommended Posts

  • 0
shokeri Explorer

shokeri

Posted
  • Author
Posted

да, вижу ступила ) проблема : див rightcol в эсплорере притыкается к верху браузера, хотя должен быть либо margin-top:70px либо padding-top:70px. В остальных браузерах все нормально..

и вторая проблема дивы menu_3 и active_form увеличиваются по высоте, по 10 px где то... я щас скриншоты сделаю, так нагляднее )))

Link to comment
Share on other sites
  • 0
user Explorer

user

Posted
Posted

Тогда зачем вот это.

<!--[if IE 6]>
<style type="text/css">

.menu_3 {position:relative; height:10px; width:140px; margin-bottom:17px; padding-top:0;}
.action_form { height 5px; padding-top:0; padding-bottom:10; font-family:Arial; font-size:11px;}
#rightcol { position: relative; margin-left: 280px; background: #fff; padding: 0; height:100%; margin-top:70px;}
.soh { position:relative; margin-left:2px; padding-top:18px; z-index:100;}
.ok_file { position:relative; float:right; width:41%; margin-right:20px; margin-top:8px;} 
</style>
<![endif]-->

<!--[if IE 7 ]>
<style type="text/css">
.menu_3 {position:relative; height:20px; width:140px; margin-top:8px; padding-top:0;}
#action_form { height:40px; padding-top:78px; font-family:Arial; font-size:11px;
.rightcol { position: relative; margin-left: 280px; background: #fff; padding: 0; height:100%; padding-top:70px;}

</style>
<![endif]-->

Link to comment
Share on other sites
  • 0
shokeri Explorer

shokeri

Posted
  • Author
Posted

честно говоря не подумала....щас попробовала поменять на класс все- вообще все пропало кроме форм... естественно есть какая-то тонкость.... щас попробую еще поколдовать... был бы толк

Link to comment
Share on other sites
  • 0
user Explorer

user

Posted
Posted
честно говоря не подумала....щас попробовала поменять на класс все- вообще все пропало кроме форм... естественно есть какая-то тонкость.... щас попробую еще поколдовать... был бы толк

Зачем все,rightcol и leftcol должны быть id.

Link to comment
Share on other sites
  • 0
~Kitty~ Explorer

~Kitty~

Posted
Posted

Что-то у меня такое чувство, что IE понимает высоту дива, как высота+отступ.. У меня такое бывало. Знаю, что скорее всего, это неправильно, но обходила это, указывая отдельное значение для IE.

Link to comment
Share on other sites
Guest
This topic is now closed to further replies.
 Share
Go to question listing

  • Обсуждения

    • Nikker
      Дизайн сайтов, landing page, логотипов, баннеров, шапок | Высокое качество, по хорошей цене

      By Nikker · Posted

      Актуальные контакты: Telegram: @Nikker_web E-Mail:   tarasevich.email@gmail.com Портфолио https://www.behance.net/d4d4186e Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ    
    • Nikker
      Брендовый дизайн в социальных сетях

      By Nikker · Posted

      Актуальные контакты: Telegram: @Nikker_web E-Mail:   tarasevich.email@gmail.com   Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ   Портфолио https://www.behance.net/d4d4186e
    • Mondeus
      Вёрстка футера на движке Xenforo

      By Mondeus · Posted

      Доброго всем времени суток. Прошу помощи. Научите принципу изменения футера. Движок Xenforo. Версия 2.2.10. Стиль дефолтный. Что именно нужно в итоге на фото примере. Мой шаблон app.footer less имеет следующее значение.  .p-footer { .xf-publicFooter(); a { .xf-publicFooterLink(); } } .p-footer-inner { .m-pageWidth(); .m-pageInset(); padding-top: @xf-paddingMedium; padding-bottom: @xf-paddingLarge; } .p-footer-row { .m-clearFix(); margin-bottom: -@xf-paddingLarge; } .p-footer-row-main { float: left; margin-bottom: @xf-paddingLarge; } .p-footer-row-opposite { float: right; margin-bottom: @xf-paddingLarge; } .p-footer-linkList { .m-listPlain(); .m-clearFix(); > li { float: left; margin-right: .5em; &:last-child { margin-right: 0; } a { padding: 2px 4px; border-radius: @xf-borderRadiusSmall; &:hover { text-decoration: none; background-color: fade(@xf-publicFooterLink--color, 10%); } } } } .p-footer-rssLink { > span { position: relative; top: -1px; display: inline-block; width: 1.44em; height: 1.44em; line-height: 1.44em; text-align: center; font-size: .8em; background-color: #4682B4; border-radius: 2px; } .fa-rss { color: white; } } .p-footer-copyright { margin-top: @xf-elementSpacer; text-align: center; font-size: @xf-fontSizeSmallest; } .p-footer-debug { margin-top: @xf-paddingLarge; text-align: right; font-size: @xf-fontSizeSmallest; .pairs > dt { color: inherit; } } @media (max-width: @xf-responsiveMedium) { .p-footer-row-main, .p-footer-row-opposite { float: none; } .p-footer-copyright { text-align: left; padding: 0 4px; // aligns with other links } }  
    • torsar
      Примеры верстки

      By torsar · Posted

      Нужны сайты с примерами верстки, типа https://css-tricks.com/. Типовые приемы и нестандартные на все случаи жизни. Накидайте ссылок.
    • Katerina23
      Какой тег использовать, чтобы увеличивать число кнопками вверх-вниз?

      By Katerina23 · Posted

      Да, подходит. Спасибо.
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept