Archief - 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.
k

kryptz

Legacy Member
Portfolio

Als je op de eerste categorie klikt zie je de thumbs hiervan.
Ik heb ze nu in een horizontale scrollbar gekregen op volgende manier:

Code: 
div.scroll {
	clear:both;
	margin:0px;
	padding:0px;
	margin-bottom:20px;
	width:780px;
	height:89px;
	float:left;
	padding-bottom:30px;
	overflow-x:scroll;
	overflow-y:hidden;
	position:relative;
}

ul.thumbs {
	clear:both;
	height:89px;
	width:1000px;
	margin:0px;
	padding:0px;
	list-style:none;
	list-style-type: none;
}

ul.thumbs li {
	display: inline;
	float:left;
	padding:0px;
	margin:0px;
	padding-right:10px;
	list-style:none;
	list-style-type: none;
}

Ik heb width:1000px; moeten doen voor hem horizontaal te krijgen, anders kwamen de thumbs op een volgende rij te staan.
Nu zit ik echter met plaats over. Er zijn te weinig afbeeldingen voor de opgegeven breedte. Hoe kan ik deze open ruimte wegkrijgen? dat hij zeg maar alle ruimte die niet ingenomen wordt wegdoet.
Z

Zero Grav

Legacy Member
Doe gewoon die width: 1000px weg bij uw ul.thumbs, vervang em desnoods door width: auto;. En die overflow-x bij uw scroll moet daar ook niet staan.

Uw site is trouwens echt niet gebruiksvriendelijk. Zelfs na de 3de keer moest ik altijd opnieuw zoeken waar ik op moest klikken om op die thumbs uit te komen. Grijze tekst is gewoon tekst, geen hyperlink.

't Zelfde met uw code, echt slecht geschreven man. Onduidelijke naamgeving enzo, ge moet daar echt aan werken. Leg die code een week neer en 'k denk niet dat ge daar zelf nog echt aan uitkunt.
k

kryptz

Legacy Member
Als ik die width wegdoe, of vervang door width:auto komen de thumbs weer op een volgende rij te staan.

Ik kan me inderdaad wel voorstellen dat voor iemand die de eerste keer op de site komt het even zoeken is in verband met die categoriën. Bedankt voor de tip, hier ga ik een betere oplossing voor zoeken.

Over de code; Ik ben nog vrij nieuw met html/css dus het is vooral nog proberen en blijven proberen :D , maar ik weet perfect hoe ik m'n website heb opgebouwd, en moest ik eventueel later iets moeten veranderen denk ik dat ik na 5 minuten kijken wel weer weet hoe alles in elkaar zit.
Z

Zero Grav

Legacy Member
Dat zal dan wellicht in Internet Explorer zijn? 'k Heb Windows nog niet geïnstalleerd dus kan het niet direct nakijken.
k

kryptz

Legacy Member
Dit was in firefox, in de andere browsers heb ik dit nog niet getest.
Zou ik nog even mogen vragen wat u bedoelde met de naamgeving?
Duid u hiermee op de naamgeving van id/class ? Of alt / title? Of nog iets anders?
Z

Zero Grav

Legacy Member
Raar, ik heb dat nochtans in Firefox gedaan met Firebug. Misschien dat ik u verkeerd begrijp met wat ge effectief wilt bereiken.

Over die naamgeving.. 't Is eigenlijk alles wat fout zit, maar het begint bij uw klasses en uw id's.

.form
.formm
.ccolor1
.ccolor2
.ccolor3

Ga zo maar door. Een klasse of id-naam zou beschrijvend moeten zijn en niet moeten terugslaan op het uiterlijk. Meer iets in de aard van "contactformulier", "inschrijvingsformulier", ..

Ook uw opbouw slaat werkelijk op niets. ^^ Bij dat contactformulier heb ik echt zoiets van "wow". Al die spans en sups zijn daar out of place. Dat moet gewoon een h3 ofzo zijn met daarin misschien een span die ge opmaakt als zijnde sup. Sup zelf moogt ge niet gebruiken omdat het in deze context niet logisch is.

Ook de manier waarop dat contactform is opgebouwd in't algemeen. Die tabel erin zou helemaal niet mogen. Gewoon labels gebruiken en die via css zo stylen dat ge hetzelfde effect krijgt.

div#logo.. Dat zou helemaal niet mogen. Zo'n leeg ding wordt gewoon niet begrepen. Dat zou bijvoorbeeld een h1 kunnen zijn met daarin een span met een beschrijving van die pagina die ge dan weer via css gaat wissen.

Edit: Was het helemaal vergeten te zeggen. 't Is niet zo'n goed idee om uw emailadres daar zomaar op uw site te zetten. Spambots zijn constant op zoek naar emailadressen en voor ge het weet zit heel uw mailbox vol op die manier.
k

kryptz

Legacy Member
Bedankt voor de tips, ik ga hier zeker en vast rekening mee houden en m'n html / css duidelijker heropbouwen.
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