All geek questions in one place

Problems with block alignment with IE7, how to solve them?

Unfortunately, I have to support IE7 (and preferably IE6) In IE8, Safari, Firefox, Chrome, I get a very good ujsing layout of an external div to expand two windows.

------------------------------------
|                                  |
|  --------------     -----------  |
|  |            |     |         |  |
|  |     A      |     |    B    |  |
|  |            |     |         |  |
|  --------------     -----------  |
|                                  |
------------------------------------

I use inline-block for style A and B. A floats to the left, B to the right. Both boxes have inner divs and other elements.

However, when I use IE6 and IE7, I get this monster.

------------------------------------
|                                  |
|  --------------                  |
|  |            |                  |
|  |     A      |                  |
|  |            |                  |
|  --------------                  |
|                     -----------  |
|                     |         |  |
|                     |    B    |  |
|                     |         |  |
|                     -----------  |
|                                  |
------------------------------------

Any final answers to what is happening and how to solve them?

+3
source share
2 answers

First, put DOCTYPE at the top of the document. This forces IE to work in standards, not in quirks mode (both euphemisms). For instance:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

-, , IE6 ( , , display: inline-block IE7 display: inline <div> display: block). :

<div id="outer">
  <div id="left"></div>
  <div id="right"><>/div>
</div>

:

#outer { overflow: hidden; }
#left { float: left; }
#right { float: right; }

, , . , .

+4

IE 6 7 , : inline. <div> s? , . ? ( . quirksmode.org)

IE :

+1

Source: https://habr.com/ru/post/1726199/

More articles:


All Articles