[CSS]min-height voor FF, IE en safari - Softwareontwikkeling

dinsdag 5 september 2006 16:40

Acties:

Topicstarter

Ik ben bezig met een website voor stage. Ik zit nu uiteindelijk met een site met 3 kolommen. Soms 2. Maar dat maakt niet uit. Ik heb een kolom links die staat vast met absolute waarden. Dan heb ik een content die met padding links en evt recht gecorrigeerd word. Dan heb ik nog een footer. Die komt rechtsonderin. Zo laag als de langste div. Of dit nou de linker, rechter of center kolom is, maakt niet uit.
Wat ik zelf al gedaan heb is hetvolgende:
min-height gebruiken, en dan voor IE <--!IF IE blabla--!>. Maar dan krijg je schijnbaar vieze code, waar ze hier niet erg van gecharmeerd zijn. Afgekeurd dus.
Toen heb ik dit gevonden:
http://www.mezzoblue.com/...16/minheight_fi/index.php
Zag er veelbelovend uit, maar dat werkt niet. Waarom precies weet ik niet. De content staat in de div maincontent die op zijn beurt weer in de div content staat. Content is dus met padding links en evt recht netjes gehouden, en maincontent heeft in princiepe niets, behalve dan dat geintje van hierboven wat ik wilde proberen, maar dat gaat al mis bij stap 1. Dus content 200px padding-top geven en dan maincontent -200px.
Ik weet het even niet meer.. die holy grails die je overal kan vinden komen allemaal in de knoop met die header.. tenzij ik er een over het hoofd heb gezien...

Hallo met Tim

dinsdag 5 september 2006 16:42

Acties:

disjfa

be

Timlog schreef op dinsdag 05 september 2006 @ 16:40:
en dan voor IE <--!IF IE blabla--!>. Maar dan krijg je schijnbaar vieze code, waar ze hier niet erg van gecharmeerd zijn. Afgekeurd dus.

Dat heet conditional comments en dat is niet vies. Dat is daar juist voor gemaakt.

[ Voor 11% gewijzigd door disjfa op 05-09-2006 16:43 ]

disjfa - disj·fa (meneer)
disjfa.nl

dinsdag 5 september 2006 16:43

Acties:

BtM909

Watch out Guys...

IE <--!IF IE blabla--!> (zoek wel ff de juiste notatie op)

Dit is juist bedacht om voor IE een aparte stylesheet te serveren, waardoor je dus juist schone code hebt, ipv allerlei lelijke hacks

Ace of Base vs Charli XCX - All That She Boom Claps (RMT) | Clean Bandit vs Galantis - I'd Rather Be You (RMT)
You've moved up on my notch-list. You have 1 notch
I have a black belt in Kung Flu.

dinsdag 5 september 2006 16:46

Acties:

Pkunk

Topicstarter

Euh.. ja.. ze willen hier toch zo schoon mogelijke html code. Kan d'r ook niets aan doen.
Ik zoek het wel in de underscore hoek denk ik.. tenzij iemand ondertussen met een briljant idee komt

Overigens is het superonhandig, want je moet voor elk html bestand telkens die statements zetten.

[ Voor 57% gewijzigd door Pkunk op 05-09-2006 16:54 ]

Hallo met Tim

dinsdag 5 september 2006 16:53

Acties:

user109731

Conditional comments is (zoals gezegd) gewoon de netste manier hiervoor.
Van de site die je aanhaalde:

Cascading Stylesheet:

*>.box p {
 margin-top: -200px;
}
/* for IE */
* html .box {
 height: 200px;
}

Nee, DAT is nette code joh

edit:

Ik zoek het wel in de underscore hoek denk ik..

wat je nu gaat doen is dus aan die schone html (die net zo schoon zou zijn met conditional comments) ranzige css hangen

[ Voor 29% gewijzigd door user109731 op 05-09-2006 16:57 ]

woensdag 6 september 2006 09:05

Acties:

OkkE

CSS influencer :+

Timlog schreef op dinsdag 05 september 2006 @ 16:46:
Euh.. ja.. ze willen hier toch zo schoon mogelijke html code. Kan d'r ook niets aan doen.
Ik zoek het wel in de underscore hoek denk ik.. tenzij iemand ondertussen met een briljant idee komt
Overigens is het superonhandig, want je moet voor elk html bestand telkens die statements zetten.

1. Underscore hack is nog vele malen viezen als Conditial Statements; je vertrouwd op een "fout" in de renderengine van Explorer. Daarnaast is dit opgelost in IE7.

2. Dankzij IE is er bijna altijd één of andere hack nodig; het beste is dan om de fix ook alleen voor Explorer aan te bieden; zie ook weer 1. Met CS is dus de schoonste oplossing.

3. Zo super onhandig is het niet; maak een 'head.php' of iets en include() die dmv een serverside-taal in elke pagina. Neem hier je <head> t/m </head> in op, en je kan al die gegevens makkelijk voor de gehele website aanpassen.

4. De code voor Conditial Statements zoals ik gebruik;

code:

1
2
3

<!--[if IE]>
<link rel="stylesheet" href="ie_only.css" type="text/css" media="screen">
<![endif]-->

5. Het artikel wat je gevonden hebt is uit 2004. Ik heb het verder niet doorgelezen, dus wat er precies in staat weet ik niet. Maar misschien heb je ook iets aan de Layout Gala website, waar een aantal veel gebruikte indelingen staan, werkt op zo'n beetje elke browser.

“The best way to get the right answer on the Internet is not to ask a question, it's to post the wrong answer.”
QA Engineer walks into a bar. Orders a beer. Orders 0 beers. Orders 999999999 beers. Orders a lizard. Orders -1 beers.

donderdag 7 september 2006 09:45

Acties:

Verwijderd

Wat is er ook alweer mis met het gebruiken van de underscore hack? Als in, hoe is het toevoegen van een IE conditional comment aan 100 pagina's beter dan een paar keer de underscore hack gebruiken in een enkel stylesheet?

Waarschijnlijk is het iets beter een "validerende hack" te gebruiken om niet in de weg te zitten van mogelijke toekomstige extensies op CSS, maar voor de underscore hack is dat toch al te laat...