Brains4All

05 april 2007

Onderbreken van data/elementen bij printen

Om koppen van tabellen ook op volgende pagina's te herhalen bij media=print en geen herhaling bij media=screen, heb ik een deel van de documentatie op http://www.w3.org/TR/REC-CSS2/page.html gelezen.

Als er meer tijd is wil ik dit wat meer onderzoeken.

Nu echter voor Kjaer een tabel onderbroken door een tr in de table reports een specifieke class mee te geven met de eigenschap: page-break-after: always;

zie style:
@page reports { size: auto; }
tr.breakHere { page-break-after: always; }

Om de th (de kop van de tabel) niet op screen te herhalen geef je de tr waarin de th's staan die je niet wilt laten zien een display: none mee, dus: tr.afterBreak th { display: none; }.

In de print.css laat je m wel zien.

Posted by serge at 01:24 pm | Comments (0)

03 april 2007

Hoogte probleem geclearde div/p in IE6

Als een serie divs, of p's worden ge left float en je wilt de float stoppen om een div/p op een 'nieuwe regel' te beginnen, dan gebruik je normaliter een clear: left.

Als de div/p op de 'volgende regel' een hoogte moet hebben van 1px gaat dat niet in IE6 in deze situatie.

De oplossing ligt hier: geef de ge-clear-de div een line-height:0 en een font-size: 0 mee, dan kan je de hoogte van de div exact bepalen.

Posted by serge at 10:12 am | Comments (0)

28 maart 2007

Google Maps - Polylines in IE6 en IE7

Ik ben er even mee bezig geweest. Tot ergernis toe.
Waarom laat Firefox de polylijnen van google maps WEL zien en IE nu weer niet?

Het zit m allemaal in het attribuut xmlns. De onderstaande html-tag + attribuut moet worden gezet:

Ook handig:
Interactive Polyline Encoder Utility, een tool coordinaten van polylijnen te encoden.

Posted by serge at 11:01 am | Comments (1)

06 maart 2007

Ul centreren binnen een div:

Ik had een probleem met het centeren van een ul in een div met een vaste breedte:

<div class="pages">			
	<ul>
		<li></li>
		<li><a href="/">2</a></li>
		<li><a href="/">3</a></li>
		<li class="activePage">4</li>
		<li><a href="/">5</a></li>
		<li><a href="/">6</a></li>
	</ul>
</div>

met de css:

.browsePagesWrapper div.pages ul { 		margin: 0; padding: 0; list-style-type: none; }
.browsePagesWrapper div.pages ul li	{ 	

margin: 0; padding: 8px 0 0 0;
display: inline; height: 23px;

GEEN FLOAT : LEFT; GEBRUIKEN

font-size: 1em; color: #2E3848;

}

dit kwam omdat de li's binnen deze ul een float left hadden. Float eruit en het is weer mogelijk om te positioneren binnen de div (de ul float niet meer). het probleem dat nu ontstaat is dat het niet meer mogelijk is in IE7 een achtergrond te gebruiken voor de "in dit geval" li met de class "activePage". De oplossing ligt in het verhogen van de line-height. Zo wordt dus ook de li aan de onderkant verlengd/verhoogd

Posted by serge at 10:55 am | Comments (0)