Jump to content
  • 0

блок не тянется по ширине в ie7


Digidie
 Share

Question

Нужна помощь. Во всех браузерах все работает нормально, а в ie криво. Вот код:

Html


<div id="wrap_header"> <!--Блок который должен тянуться -->
<div id="header"> <!--Блок который должен быть фиксированным -->
<div id="logo"></div>
<div id="menu"></div>
</div>
</div>

CSS


#wrap_header{
width: 100%;
height: 150px;
background: url(../images/header_bg.jpg) repeat-x;
}
#header{
width: 1024px;
height: 150px;
margin: 0 auto;
}
#logo{
float:left;
width: 200px;
height: 80px;
background: имадже;
}
#logo{
float:right;
height: 80px;
}

Во всех нормально отображается, нормально тянется и фиксируется. А вот в ie не растягивается и даже margin: 0 auto не пашет. Подскажите что делать.

P.S. Обычно ie во внимание не беру, а тут что то взял да глянул... :dash:

Link to comment
Share on other sites

10 answers to this question

Recommended Posts

  • 0

если вот эту чушь убрать

#logo{
float:right;
height: 80px;
}

то у вас и так #wrap_header тянется на 100% а #header центрируется. только вы это не увидите, так как у вас его ширина 1024 пиксела, что для многих и есть почти вся ширина экрана <_<

http://jsfiddle.net/8MQt8/2/

Link to comment
Share on other sites

  • 0

если вот эту чушь убрать

#logo{
float:right;
height: 80px;
}

то у вас и так #wrap_header тянется на 100% а #header центрируется. только вы это не увидите, так как у вас его ширина 1024 пиксела, что для многих и есть почти вся ширина экрана <_<

http://jsfiddle.net/8MQt8/2/

Вопрос именно об ie7. Когда в ie искусственно начинает человек растягивать блок, Ctrl +-("что для многих и есть почти вся ширина экрана"), то содержимое блока #wrap_header не тянется(неважно цвет там или градиент), во-вторых все содержимое уходит влево. И text-align: center для body не помогает! И даже если у человека разрешение больше чем 1024 то он видит тоже самое.

P.S. Та чушь никакого отношения не имеет к моей проблеме.

Edited by Digidie
Link to comment
Share on other sites

  • 0
text-align: center для body не помогает!

хм, как не парадоксально, но это свойство выравнивает только инлайн элементы..но в ie6-7 оно и блок выравнивает, странно, что оно не работает в вашем случае. :blink:

Edited by USF
Link to comment
Share on other sites

  • 0
text-align: center для body не помогает!

хм, как не парадоксально, но это свойство выравнивает только инлайн элементы..но в ie6-7 оно и блок выравнивает, странно, что оно не работает в вашем случае. :blink:

может это каким то образом от разрешения монитора зависит или может от операционки. Еще читал что может быть из за DOCTYPE. Пробовал 3 варианта, никаких изменений.

элементарно даже просто для блока написать text-align:center; в блоке текст центрируется, а сам блок нет!

Link to comment
Share on other sites

  • 0

position: relative;
right: 50%;
margin-right: - "половина ширины блока"

так пробовали?

Попробовал, тоже не пашет. Мне кажется вы чуть ошиблись, должно было(наверно) быть left:50%; margin-right: 512px; Но даже так не работает, появляется скролл очень длинный и все равно работает не так как нужно.

Link to comment
Share on other sites

  • 0

Ctrl +-("что для многих и есть почти вся ширина экрана"), то содержимое блока #wrap_header не тянется(неважно цвет там или градиент), во-вторых все содержимое уходит влево.

Именно. Во всех раузерах кроме ие Ctrl +/- - Зум. Для ие это просто какое-то непоннятное отдаление. КОроче это баг ие) не парся)

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • 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