Home  >  Article  >  Web Front-end  >  Personal insights about drop-down menu_html/css_WEB-ITnose

Personal insights about drop-down menu_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 12:18:36953browse

When I first started learning, I looked at online tutorials.
I used the ul tag to do it, but after slowly doing it, I discovered a lot of problems. .
1. The UL compatibility varies greatly between browsers.
2. Using ul is very inflexible. If you change an li, you may change the ul because they are put together

Then I thought of other methods and used

. The internal div is smaller than the external div. is large, in this case, when the mouse moves to the outer div
the inner div will be displayed. However, this overflow method does not work at all in IE6. As long as the inner div is larger than the outer size
the outer div will definitely be Expand, that is, expand to the same size as the inner div to prevent the inner div from overflowing.

Then I thought about it and changed the overflow method of the inner div to the relative positioning method of overflow, so that the outer div will never be stretched.
After testing with IE6~10, FF, safari, chrome, and opera, there is no problem. .

Personally, although I know a lot about the various properties of CSS, many problems can only be found after actual operation.
I only tested one browser before and felt that there was no problem, but after browsing After the browser compatibility test, we found that the method
has limitations. Online tutorials are also written by people. After running them in different browsers, the displayed results are also
different. . I have seen that many drop-down menus are made using
    , but in fact I really don’t like using this. .
    div is still the best and most versatile.


    Reply to the discussion (solution)

    I found that IE6 is really cheating. The problem lies in IE6. .
    Most browsers can pass it, but IE6 is the best. . . Is it really time to be eliminated?

    EN The lifespan of ie6 still has more than 400 days. In fact, it is very simple to make menus in ul, and it is easy to solve cross-browser problems.

    Change the overflow method of the inner div to the relative positioning method of overflow, so that the outer div will never be stretched. The idea behind your sentence is actually to make the internal elements lose their layout, so that the external elements will not be stretched out.

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn