div 100% hoogte (Opgelost)
W0etah - 12/03/2008 22:51 (laatste wijziging 12/03/2008 23:16)
PHP beginner
Ik heb een divje met daarin een menu, maar nu wil ik dat deze een hoogte heeft van 100%
<div id="menu">
<ul>
<li id="home"><a href="?p=home">Home</a></li>
<li id="categorie"><a href="?p=categorieen">Categorieën</a></li>
<li id="statistieken"><a href="?p=statistieken">Statistieken</a></li>
<li id="links"><a href="?p=links">Links</a></li>
<lI id="contact"><a href="?p=contact">Contact</a></lI>
</ul>
</div>
< div id= "menu" >
< ul>
< li id= "home" >< a href= "?p=home" > Home</ a></ li>
< li id= "categorie" >< a href= "?p=categorieen" > Categorieën</ a></ li>
< li id= "statistieken" >< a href= "?p=statistieken" > Statistieken</ a></ li>
< li id= "links" >< a href= "?p=links" > Links</ a></ li>
< lI id= "contact" >< a href= "?p=contact" > Contact</ a></ lI>
</ ul>
</ div>
met gewoon de height op 100% te zetten lukt het me niet, weet iemand misschien wat ik moet doen?
17 antwoorden
Gesponsorde links
vinTage - 12/03/2008 22:57
Nieuw lid
Wat is de css voor "menu" ?
tomate - 12/03/2008 22:58
Lid
Geef aub eens je CSS code van die div, anders kunnen we dit niet weten wat het probleem is.
tomate - 12/03/2008 22:58
Lid
Geef aub eens je CSS code van die div, anders kunnen we dit niet weten wat het probleem is.
W0etah - 12/03/2008 23:00 (laatste wijziging 12/03/2008 23:13)
PHP beginner
ow, sorry, ik dacht dat ik deze erbij had gezet.
#menu {
height: 100%;
width: 220px;
border-right: 20px solid #000000;
float: left;
}
#menu ul {
margin: 0px;
padding: 0px;
list-style: none;
}
#menu ul li a {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #000000;
text-decoration: none;
letter-spacing: 0.1em;
margin: 0px;
padding: 2px 2px 2px 10px;
height: auto;
background: #999999;
display: block;
width: 200px;
}
#menu {
height : 100 %;
width : 220px ;
border-right : 20px solid #000000 ;
float : left ;
}
#menu ul {
margin : 0px ;
padding : 0px ;
list-style : none ;
}
#menu ul li a {
font-family : Verdana, Arial, Helvetica, sans-serif ;
color : #000000 ;
text-decoration : none ;
letter-spacing : 0.1em ;
margin : 0px ;
padding : 2px 2px 2px 10px ;
height : auto ;
background : #999999 ;
display : block ;
width : 200px ;
}
Werken de code tags trouwens niet meer?
@hieronder: ik gebruikte gewoon de knopjes die hier staan voor code tussen te zetten
tomate - 12/03/2008 23:03 (laatste wijziging 12/03/2008 23:05)
Lid
Het is code ipv plaatscode ;)
Bij mij werkt die code perfect (in Safari browser).
vinTage - 12/03/2008 23:08 (laatste wijziging 12/03/2008 23:11)
Nieuw lid
Deze code (is de jouwe) klopt gewoon in FF en IE
<style type="text/css">
#menu {
height: 100%;
width: 220px;
border-right: 20px solid #000000;
float: left;
}
#menu ul {
margin: 0px;
padding: 0px;
list-style: none;
}
#menu ul li a {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #000000;
text-decoration: none;
letter-spacing: 0.1em;
margin: 0px;
padding: 2px 2px 2px 10px;
height: auto;
background: #999999;
display: block;
width: 200px;
}
</style>
<div id="menu">
<ul>
<li id="home"><a href="?p=home">Home</a></li>
<li id="categorie"><a href="?p=categorieen">Categorieën</a></li>
<li id="statistieken"><a href="?p=statistieken">Statistieken</a></li>
<li id="links"><a href="?p=links">Links</a></li>
<lI id="contact"><a href="?p=contact">Contact</a></lI>
</ul>
</div>
#menu {
height: 100%;
width: 220px;
border-right: 20px solid #000000;
float: left;
}
#menu ul {
margin: 0px;
padding: 0px;
list-style: none;
}
#menu ul li a {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #000000;
text-decoration: none;
letter-spacing: 0.1em;
margin: 0px;
padding: 2px 2px 2px 10px;
height: auto;
background: #999999;
display: block;
width: 200px;
}
<li id = "home" ><a href = "?p=home" > Home
</ a ></ li > <li id = "categorie" ><a href = "?p=categorieen" > Categorieën
</ a ></ li > <li id = "statistieken" ><a href = "?p=statistieken" > Statistieken
</ a ></ li > <li id = "links" ><a href = "?p=links" > Links
</ a ></ li > <lI id = "contact" ><a href = "?p=contact" > Contact
</ a ></ lI >
edit: bij jouw geen codeblok omdat je geen slash zet bij de sluittag van de code
W0etah - 12/03/2008 23:15
PHP beginner
raar, bij mij in safari en firefox werkt het niet en is het menu gewoon even groot als alle links onder elkaar
vinTage - 12/03/2008 23:16
Nieuw lid
Je ziet toch gewoon een zwarte streep van boven naar beneden ?
W0etah - 12/03/2008 23:19
PHP beginner
ja, als ik die code dat jij gepost heb letterlijk kopieer zie ik het ook, maar bij niet.
Maar wacht ik had ook nog opmaak van de knoppen, misschien heeft dat er iets mee te maken.
dit is mijn volledige css: http://plaatscode.be/6071 /
in de html staag nog altijd enkel dat menu.
vinTage - 12/03/2008 23:49
Nieuw lid
hmz, wederom geen probleem hier.
W0etah - 13/03/2008 00:08
PHP beginner
strange, ik heb ff een screenshot genomen hoe het er bij mij uitziet. (safari, maar in FF is het juist hetzelfde).
http://img181.i...ng1ef4.png
Ontani - 13/03/2008 14:18
-1
zorg dat je body en html een hoogte hebben, deze moeten beide ook op 100% staan:
body, html {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
body, html {
margin : 0 ;
padding : 0 ;
width : 100 %;
height : 100 %;
}
W0etah - 13/03/2008 14:53
PHP beginner
ah, met die html ook een hoogte geven werkte het.
Bedankt iedereen
Technicon - 12/08/2008 21:32
Nieuw lid
Hallo,
Deze post is al effe geleden, maar ik heb er toch nog een vraagje over.
Wanneer ik deze code in een html-pagina gooi werkt het perfect.
Echter wanneer ik een doctype toevoeg, werkt het niet meer en wordt de achtergrond enkel getoond tot en met de teksthoogte.
Aangezien het toch de bedoeling is om een doctype te gebruiken, vroeg ik mij af of iemand een werkend voorbeeld heeft van bovenstaande code?
Thnx!!
Gesponsorde links
Dit onderwerp is gesloten .