Although Nascape is a non-mainstream browser. However, from the study of differences in display, we can still learn a lot about compatibility and expand our thinking.
One of the most difficult cases we have to deal with when deploying a web page is that the same CSS code is interpreted by different browsers to produce different results. In the past, a variety of different browsers generated extremely different pages are everywhere, and now we can use the so-called standard browser to get better results. However, the difference in the display effect cannot be avoided.
Some leading browsers have such differences in handling floating effects. If someone wants to create a layout that can dynamically change the size of multiple columns as the size of the browser window changes, this will be a particularly troublesome issue.
Simple non-floating page
Suppose you have two divdiv # one and div # two, both of which have fixed width. Without floating or absolute positioning, these divs will be placed on the left side of the browser window in the form of one stacked on the other (as shown in example ), because the standard page is arranged from left to right, from top to bottom, block-level elements will start a new row next to the previous element.
Below is a piece of HTML required for all examples:
<Body>
<Div id = "one">
Port side text...
</Div>
<Div id = "two">
Second column text...
</Div>
</Body>
The following CSS code is used for basic, non-floating versions:
Div # one {
Width: 150px;
Margin: 0px;
Background-color: red;
}
Div # two {
Width: 300px;
Padding: 0px 10px 5px 10px;
Margin: 0px;
Background-color: silver;
}
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
