[CSS] Dropdown menu overlapping.

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Full Stack .NET Developer Graduate Program - Exper

Via Experis Academy krijg je een unieke kans om de in de branche gewilde expertise op te doen die jou tot een gewilde Full Stack .NET Developer met een frontend-specialisatie maken. Het programma duurt 21 maanden en eindigt met een vaste baan bij een van onze vele, boeiende opdrachtgevers, of je blijft bij ons (Experis) werken. Ons programma tot .NET Developer Experis Academy start met een op maat gemaakte cursus die drie maanden duurt. Gedurende deze maanden komen theorie, praktijk en .NET-certificeringen aan bod. Hierbij is het onderwijsprogramma gebaseerd op de principes als versnelde training en flipped classroom. De volgende

Bekijk vacature »

PHP Developer Online Communicatiebranche / JavaScr

Wie wordt jouw werkgever?: Wij zijn werkzaam op het gebied van interne online communicatie. Heb jij uitstekende kennis van PHP en MySQL? Heb je ervaring met de online communicatiebranche? Vaste baan: PHP Developer Online Communicatiebranche MySQL 2.800 - 4.500 PHP Developer Wij hebben een hecht team van twintig medewerkers. We werken we elke dag aan de beste netwerken. Wij zijn een veelzijdige organisatie. Je werkt voor onze eigen IT organisatie. We werken met moderne technologie en staan open voor innovatie. Wat ga je precies doen?: Voor de vacature als PHP Developer Eindhoven MySQL ga je het volgende doen: Terwijl je

Bekijk vacature »

Junior .Net ontwikkelaars gezocht, groei door tot

Bedrijfsomschrijving Ga aan de slag bij het leukste softwarebedrijf in Twente! Dit bedrijf ontwikkelt hoogstaande software die zowel binnen Nederland als buiten Nederland gebruikt wordt. De toepassingen worden door klanten gebruikt die veelal in de toeristische sector werken. Een mooi voorbeeld hiervan is een systeem dat gebruikt wordt om de goede doorstroom van grote groepen bezoekers te monitoren. Ook wordt hun innovatieve software gebruikt om kleinere ondernemers binnen de reisbranche te ondersteunen binnen hun administratie en documentatie. De organisatie bestaat al meer dan 20 jaar en er werken op dit moment zo’n 25 ontzettend sterke developers. De verwachting is dat

Bekijk vacature »

Java Developer @ Utrecht

2021-06-08 iSense Java Developer Do you like DevOps way of working? Are you looking for an exciting opportunity where latest and greatest technologies are applied? Would you like to take responsibility in each and every step of software development lifecycle ? ISKE50115 Organization You will work at global financial organization with a head office in the Netherlands. You will be part of one of the most important departments in the core banking domain. The organization has a very strong commitment to the collaboration and communication culture among different development teams. You are going to work in a squad that is

Bekijk vacature »

Senior Backend developer - Automotive

We are looking for a highly motivated and experienced Backend developer. Required Qualifications: ● 6+ years experience with a server-side programming technology ● Experience with SQL Databases ● Experience with Go(lang) ● Experience with GCP ● Hands-on test-driven development (TDD), data analytics, and SQL experience ● Experience in producing REST and RPC based services ● Experience building secure and highly-available distributed systems/microservices ● Experience with Git-based versioning and Git workflows ● Knowledge of Redis, Docker, Setting up CI/CD pipelines and Unix command line ● Knowledge of Jira and Scrum techniques ● Excellent communication skills ● Must be a self-starter with

Bekijk vacature »

Magento Developer

Bedrijfsomschrijving Dit informele bedrijf dat een aantal bekende webshops in beheer heeft is per direct op zoek naar een Senior Magento developer die de lopende webshops en andere e-commerce uitingen naar zijn hand zet. Deze gezellige organisatie telt 13 innovatieve jonge en ervaren medewerkers. Ze realiseren en beheren succesvolle webshop oplossingen en doen dit van A tot Z. Hierbij kun je denken aan bijvoorbeeld oplossingen voor warehouse en koppelingen naar kassasystemen. Bij dit bedrijf willen ze niet alleen een webshop opleveren maar gaat het om het doorontwikkelen, verbeteren en optimaliseren. Op dit moment zoeken zij een senior PHP developer die

Bekijk vacature »

.NET Developer / Azure @ Ede

2021-08-02 iSense .NET Developer Azure Ben jij een (Medior) .NET Developer en wil jij een bijdrage leveren aan een gezondere wereld door innovatieve software te ontwikkelen? Wil jij naast C# werken met nieuwe technieken zoals Microservices, Docker en Azure? Lees dan nu verder! ISKO45882 Organisatie Deze organisatie in de regio van Ede/Wageningen waar jij als .NET Developer komt te werken is marktleider en pionier op het gebied van High-Quality apparatuur in de zorg. Het Scrum team waar jij deel van zal uitmaken bestaat uit zes developers. Als .NET Developer draag jij dagelijks bij aan een gezondere toekomst. De apparatuur waar

Bekijk vacature »

RPA Developer

Voor een opdrachtgever uit de omgeving Utrecht ben ik op zoek naar een RPA Developer. Heb jij een afgeronde HBO- of WO-opleiding in de richting van IT, econometrie of Business Information Magement en minimaal 3 jaar relevante werkervaring? Dan ben ik op zoek naar jou! Deze opdrachtgever is een bekende naam in de regio Utrecht. Als RPA Developer heb je een functie waar je als spil fungeert. Binnen een team van Mendix-specialisten werk je intensief samen aan verschillende projecten bij diverse klanten. Met elkaar realiseer je vernieuwde businessapplicaties die het onze klanten makkelijker maken en de werkzaamheden efficiënter inrichten. Jij

Bekijk vacature »

ETL Ontwikkelaar / Data Engineer BI - Public Trans

Ben jij een ervaren ETL ontwikkelaar / Data Engineer BI en wil jij zorgen dat onze klanten in de transportsector waarde kunnen halen uit data en de business kunnen voorzien van hoogwaardige informatieproducten, van dashboards tot complexe voorspelmodellen? Zoek jij een nieuwe uitdaging en een omgeving waar vrijheid, teamspirit en ondernemerschap onderdeel zijn van het DNA? Dan nodigen wij jou uit om verder te lezen! Wat ga je doen? CGI zoekt een ervaren en communicatief sterke ETL Ontwikkelaar / Data Engineer BI die in een autonoom agile team kan werken via de scrummethodiek en zich bezig gaat houden met het

Bekijk vacature »

Full Stack Java Developer (IT Consultant) - Bankin

Do you have passion for technology and innovation? Are you ready to create innovative solutions to give the financial sector a solid lead in the digital world? Your day to day activities As Full stack Java Developer you will be part of the DevOps team. With a multidisciplinary team you will - in an Agile way - be working on building new functionalities and maintaining existing features. It covers both development and operations; helping to organize the continuous delivery pipeline, connecting to back end systems, performing automated tests and shaping the front end. The high-quality solutions you deliver result in

Bekijk vacature »

C# .NET Software Ontwikkelaar Magazijnsystemen / H

Over het bedrijf: Wij leveren integrale oplossingen voor logistieke processen. Wil jij software ontwikkelen voor magazijnsystemen? Heb jij ervaring met .Net en SQL? Vaste baan: C# .NET Software Ontwikkelaar Magazijnsystemen HBO WO 3.300 - 4.800 Software Engineer Ons bedrijf levert diverse integrale oplossingen om het logistieke proces aan te sturen van zowel nationaal- als internationaal toonaangevende bedrijven. Wij werken in een topsegment met vaktechnische uitdagingen. Daarnaast is er voldoende ruimte voor professionele ontwikkeling, zowel vaktechnisch als op persoonlijk niveau. Wij werken voor grote klanten. We doen omvangrijke projecten die we bij ons op kantoor realiseren (geen detachering). Wij werken met

Bekijk vacature »

DevOps Engineer

Senior DevOps Engineer Opleidingsbudget van € 5.000,- Onze opdrachtgevers werken met de nieuwste technieken dus onze medewerkers ook. Daarom bieden we jou uitgebreide opleidingsmogelijkheden en ondersteunen we je maximaal in je ontwikkeling. We bepalen samen met jou een opleidingstraject want niemand wil stilstaan in zijn ontwikkeling, zeker niet in de IT. Wat mag je nog meer verwachten? Direct een arbeidsovereenkomst voor onbepaalde tijd Een salaris tussen de € 4.000,- en € 4.500,- bruto per maand o.b.v. 40 uur Diverse bonussen: - 1800+ uur bonus - Wervingsbonus, een waardebon naar keus, ter waarde van € 1.500,- netto Een onkostenvergoeding van €

Bekijk vacature »

Functioneel Beheerder Apps

Waar het horrorverhaal IT van Stephen King, kilometers aan zeldzame boeken en functionaliteitenbeheer samenkomen. Dat is de KB in Den Haag. En het is de plek waar jij als functioneel beheerder de grootste Bibliotheek-app voor gebruikers in tiptop conditie houdt. Maak jij het mogelijk? In deze functie maak je direct maatschappelijke impact. Je voorziet in een mooi product dat honderdduizenden Nederlanders gebruiken. Je bent actief bezig hen dagelijks leesplezier te bieden en persoonlijke ontwikkeling mogelijk te maken. Daardoor werk je heel direct mee aan een slimmer, vaardiger en creatiever Nederland. En er is meer. Jij bent de functioneel beheerder die:

Bekijk vacature »

Delphi Developer

Als Delphi Developer werk je samen met andere ontwikkelteams om onze backoffice applicaties zo optimaal mogelijk te laten werken. Wat doe je als Delphi Developer bij Coolblue? Je werkt samen met andere ontwikkelteams om onze backoffice applicaties zo optimaal mogelijk te laten werken, of het nu gaat om het uitbreiden van features of het migreren naar API's. Alles om een glimlach op het gezicht van onze collega's te toveren! Hoewel je een Delphi Developer bent, ben je niet vies van een beetje C# of JavaScript. Wil jij ook Delphi Developer worden bij Coolblue? Lees hieronder of het bij je past.

Bekijk vacature »

Doorgewinterde .NET Developer

Wie zijn wij 2-Control is een IT-bedrijf dat audit, interne controle en compliance diensten en add-ons voor Dynamics 365 Business Central en Finance & Operations levert. Wij ontwikkelen Authorization Box, een cloudoplossing waarmee gebruikers rechten eenvoudig kunnen beheren en monitoren. Dit wordt gebouwd door een klein ontwikkelteam, momenteel gefocused op de migratie naar .NET 5 en het operationeel houden van het product. Hoewel gevestigd in een oud gemeentehuis in Breda (recent gerenoveerd), is de bedrijfssfeer een stuk minder formeel dan wat de voorgevel doet vermoeden. Wie zoeken wij Als je lang genoeg in code bezig bent geweest om patronen, best

Bekijk vacature »
Arjen K

Arjen K

10/01/2012 20:36:34
Quote Anchor link
Goedenavond,

Ik weer eens begonnen met scripten. In de tijd dat ik nog bezig was maakte ik al mijn websites nog in tabellen, iets dat tegenwoordig niet meer mag. Vroeger plaatste ik mijn vragen vaak op de website wmcity.nl maar deze is min of meer dood heb ik het idee. Vandaar dit ik hier eens binnen loop :-) Ik heb dus nog erg weinig verstand van de divs, en vooral het positioneren hiervan. Nu heb ik het volgende probleem. De html opzet is als volgt.

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="style.css" />
<title>Untitled Document</title>
</head>

<body>
    <div class="head">
        <div class="title">Titel van pagina</div>
    </div>
    <div class="dropdowndiv">
                <ul id="dropdownmenu">
                
                <li><a href="#">Menu 1</a>
                
                    <ul>
                        <li><a href="#">Sub item 2.1</a></li>
                        <li><a href="#">Sub item 2.2</a></li>
                        <li><a href="#">Sub item 2.3</a></li>
                        <li><a href="#">Sub item 2.4</a></li>
                        <li><a href="#">Sub item 2.5</a></li>
                    </ul>
  
                </li>
                
                <li><a href="#">Menu 2</a>
                
                    <ul>
                        <li><a href="#">Sub item 2.1</a></li>
                        <li><a href="#">Sub item 2.2</a></li>
                        <li><a href="#">Sub item 2.3</a></li>
                        <li><a href="#">Sub item 2.4</a></li>
                        <li><a href="#">Sub item 2.5</a></li>
                    </ul>
                                
                </li>

                <li><a href="#">Menu 3</a>
                
                    <ul>
                        <li><a href="#">Sub item 2.1</a></li>
                        <li><a href="#">Sub item 2.2</a></li>
                        <li><a href="#">Sub item 2.3</a></li>
                        <li><a href="#">Sub item 2.4</a></li>
                        <li><a href="#">Sub item 2.5</a></li>
                    </ul>
                                
                </li>
                
            </ul>
    </div>
    <div class="body">Body</div>
    <div class="footer">Footer</div>
</body>
</html>

 


met de volgende css

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74

body {
    font-size:100%;
    font-family:Helvetica,Arial,sans-serif;
    }

.head {
    height: 90px;
    width: 1024px;
    background-color: #046380;
    margin-left: 200px;
    margin-right: 200px;
    margin-top: -10px;
    position:absolute;
}

.title {
    font-size: 30px;
    font-weight: 800;
    color: #ffffff;
    width: 160px;
    margin-top: .7em;
    margin-left: 1em;
    position: relative;
    }

.dropdowndiv {
    width: 1024px;
    height: 20px;
    margin-top: 70px;
    margin-left: 200px;
    background-color: #efecca;
    position: absolute;
    }

.body {
    width: 1024px;
    height: 750px;
    margin-top: 90px;
    margin-left: 200px;
    background-color: #efecca;
    position: absolute;
    }

.footer {
    width: 1024px;
    height: 70px;
    margin-top: 90%;
    margin-bottom: 5%;
    margin-left: 200px;
    position: absolute;
    border-top: 2px solid #046380;
    }
    
#dropdownmenu, #dropdownmenu ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

#dropdownmenu li {
    float: left;
    width: 120px;
}

#dropdownmenu ul {
    position: absolute;
    width: 120px;
    left: -1000px;
}

#dropdownmenu li:hover ul {
left: auto;
}


Probleem hier is het volgende, het dropdown menu klapt zichzelf uit onder de body div. Ik zie de list options dus helemaal niet. Als ik de body div even er uit haal zie ik het gehele menu incl.. dropdown. Hoe zorg ik dat de dropdown div bovenop de body div komt te liggen. Heb een hoop lopen googlen maar ik zie het probleem maar niet. Heb een aantal float opties geprobeerd en overflow's maar ik heb echt geen idee of ik hier mee in de buurt zit. Anyone ? Thanks!
Gewijzigd op 10/01/2012 20:46:26 door Arjen K
 
PHP hulp

PHP hulp

22/09/2021 10:52:31
 
- Jim  -

- Jim -

10/01/2012 20:44:23
Quote Anchor link
Je kunt kijken naar z-index.
Daarmee kun je lagen op elkaar plaatsen.
 
Eddy B

Eddy B

10/01/2012 20:45:37
Quote Anchor link
Wil je je titel veranderen in iets wat de inhoud omschrijft?
 
Arjen K

Arjen K

10/01/2012 20:46:58
Quote Anchor link
@Jim, dankje wel, ga er nu naar kijken.
@Eddy, done :)

edit: Jim, mijn dank is zeer groot. Werkt :)
Gewijzigd op 10/01/2012 20:48:33 door Arjen K
 
- Jim  -

- Jim -

10/01/2012 20:54:59
Quote Anchor link
Verkorte 'studie CSS' is wel handig als je veel met DIV's gaat klooien... :p
 
Arjen K

Arjen K

10/01/2012 21:08:56
Quote Anchor link
Ghehe, yeah, working on it. Nogmaals dank!
 
Wouter J

Wouter J

10/01/2012 21:55:45
Quote Anchor link
Allereerst welkom op dit forum (zijn andere leden vergeten :S).

Ondanks dat het werkt wil ik je toch nog wat tips geven:
- Je positioneert veel doormiddel van absolute. Dit is niet waar je naartoe moet werken. Verklein je scherm maar eens en aanschouw wat er gebeurd. Het is veel beter te leren werken via, zoals wij dat noemen, de floating flow methode.. Dit betekend dat je rekening houd met de normale flow van elementen en je werkt doormiddel van margin, padding en float.
- Gebruik in je HTML niet alleen classes. Gebruik ook id's. id's zijn unieke namen voor elmenten, deze mogen maar 1 keer voorkomen en moet je bijv. voor header navigatie content en footer gebruiken. Een id heeft altijd voorrang op een class.
- Niet alles moet in een div. Je hebt ook nog eens 1000den andere tags. Voor titels hebben we bijv. <h1> t/m <h6>, h1 is een zeer belangrijke unieke titel en h6 is de meeste onbelangrijke titel.
 
Arjen K

Arjen K

10/01/2012 22:28:04
Quote Anchor link
Wouter,

bedankt voor je reactie.

- Op het moment dat ik mijn scherm verklein loopt inderdaad de layout niet geheel lekker meer, op zijn minst gezegd. Ik ga wat meer lezen over de floating flow methode.
- Juist gebruik van ID's en Classes is mij duidelijk. Ga dit aanpassen.
- Ik wil toch delen van de pagina van elkaar onderscheiden. Vroeger deed ik dit in tabellen en nu, zoals nu bij mij bekend is, moet dit nu in div containers. Hier binnen maak ik inderdaad gebruik van dingen als H1, H2 enz. maar deze zijn in dit voorbeeld en dit probleem niet relevant.

Bedankt voor je extra info. Ga er mee bezig. Goed behulpzaam forum tot nu toe!
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.