Solved

Layer hidden par <select> tag

Posted on 2006-07-10
4
667 Views
Last Modified: 2012-08-14
We have a web page with a layer and <select> tags. The layer is a small window which is supposed to hide the <select> but it does not... How can we make it hide the select ?

So it goes :

<style type="text/css">
#cat_prodiv {position:relative;width:15em;}
#cat_proinput {position:relative;width:100%;height:1.2em;display:block;}
#cat_procontainer {position:relative;bottom:4px;right:4px;border:1px solid #404040;background:#fff;font-size:85%;overflow:hidden;}
#cat_proshadow {position:absolute;width:100%;*width:auto;_width:100%;margin:.3em;z-index:5;background:#a0a0a0;} /* bug 614383 workaround for ie7 */
</style>

<div id="cat_prodiv"><input id="cat_proinput" style="height:18px;width:120px;" type="text" name=zoom2 autocomplete=off>
                    <div id="cat_proshadow"><div id="cat_procontainer">bla bla bla<br>bla bla bla<br>bla bla bla<br>
                        bla bla bla<br>bla bla bla<br>bla bla bla<br>bla bla bla<br></div></div>
                      </div>
<br><br>
<select><option>hello</select>

and we want to "hello" to be hidden by the "bla bla bla" lines.

Help greatly appreciated.
 
0
Comment
Question by:javilmer
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
4 Comments
 
LVL 30

Accepted Solution

by:
GrandSchtroumpf earned 200 total points
ID: 17075300
The problem is only in IE...
Select element is a "windowed element" (in M$ lingo).
And "windowed element" always display on top on "windowless elements".
http://support.microsoft.com/kb/q177378/
0
 
LVL 2

Expert Comment

by:holly29
ID: 17080657
The comment above is correct, not an answer though.
What's your need for  hiding the <select>?

Do you want to create a combobox with both input and dropdown options?
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Unordered lists (HTML ul tags) are very handy to create menus of all types, shapes and sizes.  All it takes is a little knowledge of CSS and the possibilities are endless. First off, you should know the general format for menus created using the …
This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
In this tutorial viewers will learn how to define a gradient in CSS. Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Gradient. Define the background as "linear-gradient(to right, #ee3668, black)". Ensure you …
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…

737 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question