Archief - Positie en horizontale scrollbar

Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
F

FurtiveDuck

Legacy Member
KSA Watou

Dag beste mensen,

Als eindwerk kregen wij de opdracht om een website te maken van een willekeurige vereniging. Ik koos om de website van de jeugdbeweging te verzorgen. Nu is de website zo goed als af, maar er zijn nog enkele schoonheidsfoutjes.

Ik weet dat de website niet zo denderend is qua code enzo, dus geef daarop a.u.b. geen kritiek. Het is een rommelboel van jewelste, maar 90 procent van de leerstof die we nodig hadden voor ons eindwerk moesten we zelf opzoeken. Het was dus een periode van vallen en opstaan, maar ik heb er enorm veel uit geleerd. Tips voor de website die voor verbetering zouden kunnen zorgen zijn altijd welkom, zolang er geen drastische veranderingen mee gemoeid zijn.

En ja, ik weet dat ik de navigatie het best doe met een listbox: maar dat had ik pas ontdekt nadat de website er bijna al volledig was en sinds ik zo dom ben geweest om niet te werken met een paginasysteem zou het me dagen kosten om in iedere pagina de navigatie door een list te vervangen.

Nu had ik 3 vragen:


  • In Firefox verschijnt het linker submenu net ietsje boven de lijntjes van de achtergrond afbeelding (I know, noob.). Hoe zou ik dit het best kunnen oplossen? In Internet Explorer lijkt alles in orde te zijn.

  • Ik krijg een horizontale scrollbar. Hoe krijg ik die het best weg en blijft mijn website dan nog gecentreerd?

  • Waar kan ik deftige downloadable (.swf) flash games vinden? Ik zou er toch enkele op mijn websites willen, maar de games die ik via google vind zijn praktisch brol. Games die je kan vinden op teagames.com enzo zullen waarschijnlijk niet te vinden zijn zonder te grijpen naar de illegale middelen?

De stylesheet.css:

Code: 
#CONTAINER {
	position:relative;
	width:760px;
	left:50%;
	margin-left:-380px;
}
#HEADER {
	position:relative;
	background:url("afbeeldingen/HEADER.gif") no-repeat;
	width:760px;
	height:42px;
}
#BOVENNAVIGATION {
	position:relative;
	background:url("afbeeldingen/TOPNAVIGATION.gif") no-repeat;
	width:760px;
	height:42px;
	color:white;
}
a {
	color:white;
	text-decoration:none;
}
a:hover {
	color:#fe7e01;
}
#NAV1 {
	padding-top:15px;
	float:left;
	padding-left:30px;
	
}
#NAV2 {
	padding-top:15px;
	float:left;
	padding-left:56px;
	
}
#NAV3 {
	padding-top:15px;
	float:left;
	padding-left:62px;
}
#NAV4 {
	position:relative;
	padding-top:15px;
	float:left;
	padding-left:65px;	
}
#NAV5 {
	padding-top:15px;
	float:left;
	padding-left:50px;	
}
#NAV6 {
	padding-top:15px;
	float:left;
	padding-left:40px;	
}
#BOVENCONTENT {
	position:relative;
	background:url("afbeeldingen/BOVENCONTENT.gif") no-repeat;
	width:560px;
	height:162px;
	float:right;
}
#TEKSTBOVEN {
	*padding-top:12px;
	padding-left:10px;
	padding-right:10px;
	color:white;
	line-height:150%;
}
#LINKERNAVIGATION {
	/*position:relative;*/
	background:url("afbeeldingen/LINKERNAVIGATIE.gif") no-repeat;
	width:200px;
	height:593px;
	float:left;
}
#NAVIGATIETEXT1 {
	padding-top:40px;
	padding-left:30px;
}
#NAVIGATIETEXT2 {
	padding-top:5px;
	padding-left:30px;
}
#NAVIGATIETEXT3 {
	padding-top:5px;
	padding-left:30px;
}
#NAVIGATIETEXT4 {
	padding-top:5px;
	padding-left:30px;
}
#NAVIGATIETEXT5 {
	padding-top:5px;
	padding-left:30px;
}
#NAVIGATIETEXT6 {
	padding-top:5px;
	padding-left:30px;
}
#CONTENT {
	*padding-top:5px;
	position:relative;
	background:url("afbeeldingen/CONTENT.gif") repeat-y;
	width:560px;
	min-height:593px;
	float:right;
}
#CONTENT a {
	color:black;
}
#CONTENT a:hover {
	color:#fe7e01;
}
* html #CONTENT {
	height:593px;
}
#TEKSTBOTTOM {
	padding:10px;
	line-height:150%;
}
#FOOTER {
	position:relative;
	background:url("afbeeldingen/FOOTER.gif") no-repeat;
	width:760px;
	height:43px;
	color:#5c5b5b;
	padding-top:20px;
	padding-left:550px;
	float:left;
}
body {
	background-color: #343434;
	font-family: Arial;
	font-size: 11px;
	color:black;
}
h1 {
	font-family: Verdana, sans-serif;
	font-size: 20px;
	font-style: bold;
	font-weight: normal;
	text-transform: normal;
	letter-spacing: normal;
	line-height: 1.3em;
	color: #072B54;
}
#TEKSTBOVEN h1 {
	color:#FFFFFF;
	font-size:25px;
}
h2 {
	color:#072B54;
	font-size:13px;
	font-weight:bold;
}
li:ul {
	padding-top:20px;
	padding-bottom:20px;
}
img.lightboximg {
border: 1px black solid;
}

Dank bij voorbaat. :unsure:
R

RealFlub

Legacy Member
Een handige plugin voor FF: Firebug ;)
en als ik even kijk daarmee, zie ik dat het ligt aan uw footer.
ligt aan uw padding. je stelt een breedte in van 760px (uw text dus ook), maar daar bovenop gebruik je nog eens een padding van 550px.. dus vandaar dat je alles opschuift.
doe eens de padding weg, en je zult zien dat uw horizontale scrolbar weg is.
De website is nog steeds gecentreerd (logisch)

wil je toch uw tekst aan de rechterkant, maak gebruik van text-align: right;
+ een padding-right

wel enkele opmerking als ICT'er (die net z'n eerste jaar webtechnieken opzitten heeft :p)
-> uw bovennavigatie is een lijst.. maar je maakt allemaal gebruik van DIVS?
-> idem voor uw linkernavigatie
-> check eens met w3c.org ;) je zult zien dat er hier een daar foute dingen inzitten.
-> steek uw footer in een <p> en daarbuiten een DIV.
hierdoor kun je dan een padding toekennen aan uw paragraaf (<p>-element) zonder dat je aan de andere dingen komt.
F

FurtiveDuck

Legacy Member
Bedankt,

De meeste problemen werden nu opgelost. Erg handige plugin, inderdaad!
Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
Terug
Bovenaan