Ik wil alleen een scroll balk van onder naar boven

Status
Niet open voor verdere reacties.
J

jorenman

Gebruiker
Lid geworden
27 jul 2013
Berichten
222
<html>
<head>
<title>Joren Wouters - De maker voor uw website!</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="container">
<div id="header">
<img src="image3.jpg" width="100%" height="450px">
</div>
<div id="navmenu">

<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Over mij</a>
<ul>
<li><a href="#">Wie ben ik?</a></li>
<li><a href="#">Wat doe ik?</a></li>
</li>
</ul>
<li><a href="#">Het plan</a>
<ul>
<li><a href="#">Mijn product</a></li>
<li><a href="#">Mijn paketten</a></li>
</li>
</ul>
<li><a href="#">Contact</a></li>

</ul>





</div>
<div id="body">

</div>

</div>
</body>
</html>


#container {
max-width: 100%;
height: 1000px;
margin: auto;
}
#header {
position: absolute; top: 0px; left: 0px;
height: 450px;
width: 100%;
margin: auto;
}
#navmenu {
position: absolute; top: 450px; left: 0px;
height: 75px;
width: 100%;
margin: auto;
border: 1px solid #000;
}

Dit is een HTML en een CSS bestand.
Ik wil dat er op mijn site alleen een balk is waarmee je van onder naar boven kan scrollen, maar automatisch komt er dan ook een balk waarmee je van links naar rechts kan scrollen en dat wil ik niet.
Hoe zorg je ervoor dat je alleen een scroll balk van onder naar boven krijgt en wel gewoon width: 100%; kan gebruiken?
 
Beste Remco,
Helaas veranderd dit niet dat er geen scroll balk meer aan de onderkant is....

Groetjes Joren
 
Dat is raar want bij mij werkt het wel. Dan ligt het waarschijnlijk aan de image die ik niet heb.
 
Remco,

Ik heb het niet over één bepaalde afbeelding hè, ik heb het over heel de webpagina.

Groetjes, Joren
 
Ik zie het probleem al.

Je geeft de container een max-width:100%; en ook de image.
Het beste is om je container een width van bijvoorbeeld 800-1000px te geven.

edit: een width van 100% (als container) zorgt ervoor dat de pagina nog nét een stukje doorgaat in de breedte. Vandaar dat je hiervoor een vaste/standaard waarde moet geven.
 
Laatst bewerkt:
Toevoegen:

html {
height: 100%;
/*cross-browser, toon altijd vertikale scrollbar*/
padding-bottom: 1px;
}

Wijzig width en max-width:

#container {
/*cross-browser, eerst width dan max-width opgeven*/
width: 100%;
max-width: 100%;
height: 100%;
}

Wijzig width en border om horizontale balk weg te halen

#navmenu {
position: absolute; top: 450px; left: 0px;
height: 75px;
width: 98%;
margin: auto;
border: 1% solid #000;
}

@koekje000
Bij 100% gaat de container niet een stukje door, echter bij gebruik van een border ligt de border buiten de opgegeven breedte.
 
Laatst bewerkt:
Maar als ikdit doe, komt er (als ik met kleuren ga werken) aan de rechterkant een witte balk, toch?
 
Ik begrijp de vraag niet helemaal, maar ik vermoed dat je dit bedoelt:

#navmenu {
width: 98%;
border: 1% solid #000; <= waarom border rondom als breedte 100% is?
}

Je kunt border weghalen en width op 100% zetten...
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan