Grow your CSS skills. Land your dream job.

How to make CSS Drop down possible to over html <select>

  • # February 10, 2009 at 8:13 am

    How to make CSS Drop down possible to over html <select> element in IE 6 and 7 . Z-index is not working i’ve tried

    @chris ; this was awesome : http://css-tricks.com/select-cuts-off-o … in-ie-fix/

    now make for this problem too.

    # February 10, 2009 at 8:39 am
    "jitendra" wrote:
    How to make CSS Drop down possible to over html <select> element in IE 6 and 7 . Z-index is not working i’ve tried

    @chris ; this was awesome : http://css-tricks.com/select-cuts-off-o … in-ie-fix/

    now make for this problem too.

    is it just a basic drop down you want? cause you have been asking this question for ages, with people, me included helping…

    your original did not have drop downs, you had un-ordered list items.

    a basic drop down is this:

    Code:

    populate your option tags with whatever text you want..

    there is a drop down menu.

    if you want to use the information i that then add a value to each;

    Code:

    if you want one to be selected like american sites do, they highlight united states when it should be near the bottom cause of alphabetical order then selct one option to be selected:

    Code:

    remember the select goes inside a form tag

    check out here: http://www.tizag.com/htmlT/htmlselect.php

    # February 10, 2009 at 8:50 am

    this is not my problem

    # February 10, 2009 at 8:50 am

    also check here if it is a css one you want:
    http://www.cssplay.co.uk/menus/

    # February 10, 2009 at 9:19 am

    The problem is every type of horizontal drop-down navigation menu goes under if page has Select box in drop-down range.

    # February 10, 2009 at 10:05 am
    "jitendra" wrote:
    The problem is every type of horizontal drop-down navigation menu goes under if page has Select box in drop-down range.

    ?

    a link might be helpful

    # February 10, 2009 at 11:40 am

    Please check this is the problem : http://jitendravyas.com/ie6.html

    # February 10, 2009 at 12:03 pm
    "jitendra" wrote:
    Please check this is the problem : http://jitendravyas.com/ie6.html

    I still don’t understand what you are wanting???

    do you need the selct options? are they going to be used?
    you you mean, the select options are hidden when you hover over the top links?
    do you mean, you need the select options to move down when you hover over the top links?

    # February 10, 2009 at 1:08 pm
    Quote:
    I still don’t understand what you are wanting???

    do you need the selct options? are they going to be used?
    you you mean, the select options are hidden when you hover over the top links?
    do you mean, you need the select options to move down when you hover over the top links?

    check this link in IE 6 only : http://jitendravyas.com/ie6.html

    i need a solution for IE6

    yes i need select options. they are going to be used.

    yes i need select options to move down when you hover over the top links in IE6 (in other browser working fine)?

    # February 10, 2009 at 1:19 pm
    "jitendra" wrote:
    Quote:
    I still don’t understand what you are wanting???

    do you need the selct options? are they going to be used?
    you you mean, the select options are hidden when you hover over the top links?
    do you mean, you need the select options to move down when you hover over the top links?

    check this link in IE 6 only : http://jitendravyas.com/ie6.html

    i need a solution for IE6

    yes i need select options. they are going to be used.

    yes i need select options to move down when you hover over the top links in IE6 (in other browser working fine)?

    you said z-index does not work, what about z-indexing the selects?

    # February 10, 2009 at 1:26 pm

    z-indexing is not working on both select and navigation in IE 6?

    # February 10, 2009 at 2:37 pm
    "jitendra" wrote:
    z-indexing is not working on both select and navigation in IE 6?

    ok, just looking at your code, it will not validate?

    please test it here: http://jigsaw.w3.org/css-validator/

    cause you have top: & width:

    but looking through google with search terms: http://www.google.com/search?hl=en&q=z- … h&aq=f&oq=

    I found this:
    http://www.throbs.net/web/articles/IE-S … /#ieZIndex

    http://support.microsoft.com/kb/177378

    http://www.codetoad.com/forum/20_22736.asp

    after some reading of only about 10 mins, I find that IE6 does not let selects work with z-index, but you probably could find a workaround

    # December 21, 2009 at 3:32 pm

    Using jQuery to fix select drop down cut off in ie. Here is an example on Lance Ennen’s Blog.

    http://blog.lanceennen.com/post/2936179 … -width-fix

Viewing 13 posts - 1 through 13 (of 13 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".