Archief - CCS-P ; Height niet kleiner te krijgen

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

El Pietrovich

Legacy Member
Yo,

Ben een prototype aant het maken voor een site met CCS-P.
Het probleem is dat ik bv divs niet kleiner kan aanpassen qua height, maar wel groter.

Ik heb bv een header op de site:

#header {
width:100%;
height:20px;
border:1px solid black;
}

Pas ik zo toe:

<div id="header">blablabla.. en nog veel meer</div>

Nu als ik da bekijk in explorer / firefox dan is die height zeker niet 20px.
Ik heb al geprobeerd met % ook, werkt ook niet.
Nu dacht ik, ok misschien wordt die height property niet goed ondersteund..maar jawel, want bv op 500px zetten, dan is da echt wel 500px.

Ik heb ook m'n body gestyled op height:100%; zodat die div een referentie heeft als containing box indien ik % zou gebruiken.

Iemand een oplossingske?

Merci
A

Asshen

Legacy Member
Ben niet zeker, hoor, maar moet het niet <div class=""> zin ?

K.
W

WoDkA

Legacy Member
Asshen zei:
Ben niet zeker, hoor, maar moet het niet <div class=""> zin ?

K.
Klik om te vergroten...

mja als ge het voor meerdere headers ga gebruike,
zal't idd class moeten zijn :)

en dan in css oproepen met .header ipv #header
E

El Pietrovich

Legacy Member
Nee, moet niet class zijn.

In de CSS is het gedefinieerd als #header, dus moet het ID zijn.
Het moet niet gebruikt worden voor meerdere dingen, kheb namelijk maar 1 header.
J

Jellepunk

Legacy Member
kweetniet maar moet die width en height niet van plaats verwisseld worden?
`

`SeriOUs

Legacy Member
omg, ID gaat evengoed lukken hoor.
bij mij gaat het correct. Ben je wel zeker dat het geen 20 px is. 20 px is echt niet hoog hoor (normale lijnhoogte bijna)
Je moet eens een screenshot nemen en in een tekenprogramma kijken of het echt niet 20 px is, heb me meermaals daar ook al in vergist.
Post je xhtml-bestand eens?
E

El Pietrovich

Legacy Member
Ik heb gemerkt waar het foutgelopen kan zijn.

Ik ging er van uit dat je de style ook kan gebruiken op een tabel, omdat dit ook een block component is.
Mijn html:

<table id="header">
<tr align="center" height="10">
<td colspan="2" width="50%"><b><a href="intranet.htm">PMINTRANET</a></b></td>
<td width="50%" bgcolor="#0099CC"><b>TIMEM@TRIX</b></td>
</tr>
<tr>
<td width="22%" align="left"><img src="logo_intranet.JPG" width="100" height="100" style="padding-left:10px;"/></td>
<td width="23%" align="center"></td>
<td align="right" style="padding-right:10px "><b>User:</b> SCLAES<br><b>Projects(s):</b> Fortis<br><b>13/10/04 - 13:09</b><br><b>logged in as</b> <i>ADMIN</i></td>
</tr>
</table>

Ik heb ook eens geprobeert van de tabel in een DIV te zetten en daar de style op toe te passen, maar dat doet hij helaas ook niet. Height blijft de originele tabelhoogte.
Ik weet het, het is niet de perfecte methode, maar het was voor een prototype te maken en moest snel gaan.
Ik had geen zin om binnenin een DIV nog eens alle elementen apart te gaan positioneren, of kan het anders?

Merci
D

DarkBone

Legacy Member
PHP: 
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
 	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html>
 <head>
 
 <style type="text/css">
 <!--
 
 #test
 {
 	height: 20px;
 	background-color: red;
 	/* overflow: hidden; */
 }
 
 -->
 </style>
 
 </head>
 <body>
 
 <div id="test">
 slflshd <br />
 sqfdfqsdslflshd <br />
 &éà&èçd <br />
 sdlfhqç'à
 </div>
 
 </body>
 </html>

Werk perfect zo... mar haal de DOCTYPE weg en uw browser vervalt in quirks mode, en daar werkt het niet.

Wat er moet gebeuren met de tekst die 'overflowt' bepaal je ook via css, maar dat heb ik even in commentaar geplaatst.

*Edit*
het feit waarom hem standaard nie kleiner wil gaan is omwille van de tekst erin (dat kan zelfs een spatie zijn)
F

Fr3aK

Legacy Member
Ik had ook zoiets voor, in FF is men div 5px hoog (zoals in de CSS) maar in IE wou die ni kleiner dan 8-10px :unsure:
d

dJeez

Legacy Member
Als de fontgrootte van de tekst in uw tabel groter is dan 10px dan rekt die tabel uiteraard uit, 't is maar dat je 't weet...

BTW 'k Zou in 't vervolg de naam van de firma waar je (wellicht toch) voor werkt wel weglaten :p.
D

DarkBone

Legacy Member
dJeez zei:
Als de fontgrootte van de tekst in uw tabel groter is dan 10px dan rekt die tabel uiteraard uit, 't is maar dat je 't weet...

BTW 'k Zou in 't vervolg de naam van de firma waar je (wellicht toch) voor werkt wel weglaten :p.
Klik om te vergroten...
Bij nen DIV is da toch nie het geval (zie mijn voorbeeld)... met een tabel lukte dat echter niet (dus dan klopt het idd), ofwel deed ik toen iets verkeerd?
E

El Pietrovich

Legacy Member
Het wil nog steeds niet werken.
Ik heb nu eens ipv een tabel een div genomen met tekst in:
Code: 
html, body {
width:99.5%;
height:100%;
}

#main {
position:absolute;
top:5px;
left:2%;
right:2%;
width:96%;
height:95%;
}

#calendar {
clear:left;
float: left;
width: 15.5%;
height: 10%;
border: 1px dashed black;
}

<div id="main">
    <div id="calendar">
       CALENDAR
    </div>
</div>

Resultaat -> De div is maar de lettergrootte hoog, en niet 10% van zijn containing box.
Ik heb trouwens dezelfde DOCTYPE als DarkBone gebruikt.
Het rare is wel dat het in IE wel werkt, maar het is FireFox die dus tegenstribbeld

*EDIT*
Heb bovenstaande code eens uitgevoerd in een nieuwe html file, en dan werkt het wel. Blijkbaar zal er ergens een foutje in m'n andere html zitten. Ik zoek voort :)

*EDIT2*
Gevonden!
Je gelooft het nooit (enfin, ik toch niet).
Oorzaak van alle ellende was een comment tag.
Ik had binnenin de <style> tag HTML comment gebruikt ipv css comment. Lekker negeren wat erna komt denkt firefox dan maar..
Anyway, bedankt allemaal! :bow:

*EDIT3*
:doh: Toch niet gevonden. Door al dat zoeken en veranderen was ik mijn oorspronkelijk probleem al uit het oog verloren...het wou wel groter, maar niet kleiner.
Maar door te wijzigen enzo wou het niet groter ook.
Dat lukt nu dus wel weer...(door die comment tag).
Kleiner maken lukt dus nog steeds niet, hoewel het terug een fout moet zijn, want het andere voorbeeld werkt wel.
Tevens bij dat andere voorbeeld is het firefox die goed werkt, en de div verkleint tot een hoogte dat ik het wil, maar doet IE het daar niet...GRRRRRRRRR! Standards, waar zijn ze ook voor nodig....
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