Versio

[CSS] select door div

Overzicht Reageren

Elwin - Fratsloos

Elwin - Fratsloos

15/11/2005 14:09:00
Quote Anchor link
Ik heb op een pagina een <select>. Op die pagina maakt ik gbruik van een menu zoals hier (niet dezelfde), mat van die dropdown-submenu's (opgebouwd uit div's)...

Daarnaast gebruik ik ook een <div> die normaal verborgen is maar bij de klik op een button tevoorschijn komt.

Nu staat de <select> precies onder die div's (van het menu en die tevoorschijn komt). Tenminste.. in Firefox staat die er achter. In IE komt de <select> er doorheen...

Iemand een suggestie?

Elwin
 
PHP hulp

PHP hulp

24/05/2012 08:15:48
Gesponsorde koppelingen:
 
Erik Rijk
Moderator

Erik Rijk

15/11/2005 14:11:00
Quote Anchor link
z-index?

ik weet niet precies wat je bedoeld

EDIT: typo
Gewijzigd op 15/11/2005 14:12:00 door Erik Rijk
 
Bas Kreleger
Beheerder

Bas Kreleger

15/11/2005 14:12:00
Quote Anchor link
probeer eens de hidden class ook specifiek in de select te melden (<select class="hidden/unhidden">). Weet niet hoe je het precies hebt??

Anders kun je ook even proberen:

<select style="display: hidden"> ? kijken of dat werkt.. zo ja dan ff de stijl toepassen die je nu ook gebruikt maar dan ook specifiek voor de select..

hoop dat het wat logisch klinkt :)
 
Jelmer rrrr

Jelmer rrrr

15/11/2005 14:14:00
Quote Anchor link
Tja, dat is een bekende "bug" van internet explorer.
(ik zal even zoeken of ik daar nog iets op kan vinden...)
 
Elwin - Fratsloos

Elwin - Fratsloos

15/11/2005 14:27:00
Quote Anchor link
z-index van de div's is hoger dan die van de select.. Dat is dan toch goed? :)

En ik ga liever niet beginnen aan het verbergen van elementen als ik op een knop druk. Dat vind ik geen nette oplossing. Maar als er niets anders is.. :)

Oh.. dan kan ik natuurlijk ook zo'n bericht doen als er iemand met IE komt: U gebruikt een oude browser die deze website niet ondersteund.... ;)

Anyway.. ik heb die div die tevoorschijn komt van het 'Zichzelf invullende formulier' af. Dit is daarvan de CSS:

#selectwindow {
border: 1px solid #000000;
background-color:#CCCCCC;
-moz-border-radius: 4px;
-moz-box-sizing: border-box;
padding: 5px;
display: block;
width: 400px;
height: 125px;
position: absolute;
z-index: 20;
left: 150px;
top: 80px;
}

De select waar het over gaat heeft deze:

select.right {
position: relative;
left: 0px;
}

Edit:

En de zi-index van de slect staat in deze:
select {
position: absolute;
left: 225px;
font-family: Verdana, Tahoma, Arial, sans-serif;
font-size: 10px;
z-index: 1;
}

Die select.right gebruik ik om de select in de text te kunnen zetten, ipv uitgelijnd te hebben.

Elwin
Gewijzigd op 15/11/2005 14:29:00 door Elwin - Fratsloos
 
Erik Rijk
Moderator

Erik Rijk

15/11/2005 14:29:00
Quote Anchor link
The z-index property sets the stack order of an element. An element with greater stack order is always in front of another element with lower stack order.
 
Jelmer rrrr

Jelmer rrrr

15/11/2005 15:04:00
Quote Anchor link
Ja, maar IE gebruikt het combobox-widget uit Windows zelf. Daardoor wordt deze bovenop de html-pagina en alles wat daar toebehoort geladen. In IE op mijn PDA is het heel goed te zien. Waneer je daar de pagina met input/select-elementen naar beneden scrollt, zie je ze erachter aan doezelen. Dit gewoon omdat IE op mijn PDA zo ontzettend sloom is.

Maar in ieder geval, vooor zover ik weet zijn er maar 2 oplossingen:
1: waneer een popup verschijnt, geef je de combobox visibility:hidden mee.
2: vervang de combobox door een javascript dat er hetzelfde uitziet, hetzelfde doet, maar geen windows combobox-widget gebruikt. Maar waneer er dan geen javascript op de browser zit, heeft iemand geen combobox. (tenzij je deze natuurlijk eerst wel in de pagina hebt staan maar met javascript eruit haalt en vervangt. Dit heeft wel als voordeel dat je de combobox volledig kan stylen naar de rest van de pagina)
 
Elwin - Fratsloos

Elwin - Fratsloos

15/11/2005 15:33:00
Quote Anchor link
Geen JS is geen optie.. :) Het is een intern systeem en gebruikt heel veel JS. Maar het makkelijkste is dus om die select maar hidden te maken.

Nu is het voor het menu (nog) niet nodig omdat die niet lang gnoeg is... en met die div die tevoorschijn komt is het niet zo moeilijk.. :)

Bedankt voor het meedenken iig...

Bij de web.. dat 'springen' van die select op de PDA is me idd ook wel eens opgevallen... Weten we ook hoe dat komt... :)

Elwin
 



Overzicht Reageren