Archief - CSS/HTML: Horizontale scrollbar bij overflow

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.
A

Archangelus

Legacy Member
http://users.pandora.be/Archangelus/Mediashop

De dingen in de basket aan de rechterkant zouden moeten afgekapt worden of er zou een horizontale scrollbar moeten verschijnen als ze te lang zijn, maar om de een of andere duistere reden worden die strings niet afgekapt (kdenk niet dat dit mogelijk is met enkel CSS/html, later moet er nog asp aangekoppeld worden) en komt er ook geen scrollbar, maar wordt alles onder elkaar gezet.

Hetgeen ik zou willen is iets als dit waar die lijnen tekst dus afgekapt worden of een horizontale scrollbar als dat afkappen niet gaat.
S

Saetie

Legacy Member
Hoe heb je de verticale scrollbar gekregen in het grootste tekstvak eig ?
O

Obliv`

Legacy Member
uw xhtml van basket dinkske:
<div class="lijst"></div>

uw css van lijst:
.lijst {
position:relative;
top:1px;
left:1px;
width:114px;
height:100px;
border-style:solid;
border-width:1px;
overflow:auto;
}

=> het probleem is de width denk ik, als ge die wegdoe zou het mits wa gefoefel wel moete lukke denk ik :)
A

Archangelus

Legacy Member
Saetie zei:
Hoe heb je de verticale scrollbar gekregen in het grootste tekstvak eig ?
Klik om te vergroten...

#home-body {
...
overflow: auto;
}

Maar alsk die width wegdoe, gaat em die kader dan ni helemaal uitrekken? Enfin, kzal het eens proberen, misschien lukt het wel :)
A

Archangelus

Legacy Member
Nope, da doet dus niks :(
Zelfs zonder width blijft em die tekst ondereen zetten.
b

bRahms

Legacy Member
Mits wat (correct) te foefelen komt met altijd op iets correct uit:

Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>
div.testje {
border: 1px solid black;
width: 100px;
height: 100px;
overflow-x : scroll; /* ge kunt hier nog kiezen, scroll of auto */
overflow-y : auto;
}</style>
</head>

<body>
<div class="testje">[B]<pre>[/B]The White Stripes - Seven Nations Army [B]</pre>[/B]</div>
</html>

overflow-x is het attribuut dat er voor zorgt dat, wanneer je tekst buiten het kader zou treden, dat die niet wordt afgekapt, maar dat er een scroll komt.
Nu, zoals je wellicht zelf ook al ondervonden hebt, wordt tekst in een div altijd tot op de laatste letter afgebroken (zonder afkappingstekens, whatever).
Daarvoor is er de <pre></pre> tag, die zorgt ervoor dat alles wordt weergegeven zoals je het hebt meegegeven in de code.

Een ander handig voorbeeld waarbij je pretag kunt gebruiken, is wanneer je 10 spaties moet plaatsen (&nbsp; ). In plaats van

getal1&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;getal2

plaats je dan gewoon
Code: 
<pre>
getal1          getal2
</pre>
En uw tien spaties staan er ook.

Daarom ook dat ik het 'foefelen' noemde ;). Maar zo gaat het dus.
A

Archangelus

Legacy Member
woot, met preserve tags bolt het wel :D
Aan die nowrap bij white space had ik zelfs ni gedacht, omdat het uiteindelijk geen probleem van spaties is.

Bedankt he :)
b

bRahms

Legacy Member
Archangelus zei:
woot, met preserve tags bolt het wel :D
Aan die nowrap bij white space had ik zelfs ni gedacht, omdat het uiteindelijk geen probleem van spaties is.

Bedankt he :)
Klik om te vergroten...
Inderdaad, maar op de tags wat uit te leggen (ge weet nooit dat ge der nog nooit van gehoord had he ;)), heb ik het ander voorbeeldje derbij geplaatst.

Graag gedaan :)
L

Lashknife

Legacy Member
waarom pre gebruiken als er een css command is?

en wordwrap heeft alles te maken met spaces :)

als je zonder opmaak gaat typen, gebruik je best de white-space: "pre";
als je zelf een enter wilt ingeven -> <br> (ik hoop dat die css geen onderscheid maakt in <br> en <br />)
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