Archive for the ‘code’ Category

Newer Entries »

Browser vensters openen en toch valideren

Posted on: October 16th, 2003 | Category: Xhtml/Css

Als je je sites bouwt in xhtml, dan loop je soms wel eens tegen kleine probleempjes aan. Een goed voorbeeld daarvan is het target attribuut van de <a>-tag. In xhtml 1.0 kan je dit attribuut dus niet meer gebruiken. De reden dat het niet meer gebruikt kan worden is dat (x)html zich alleen bezig moet houden met hoe informatie wordt weergegeven in de browser. Maar soms wil je gewoon een link in een nieuw browser venster openen. In comes JavaScript.

Bij SitePoint hebben ze een aardig artikeltje over hoe je dit kan bewerkstelligen door middel van JavaScript. Lees ook meteen even het forum-topic, dat bij het artikel aansluit, daar worden nog een paar handige tips gegeven.

Inhoud scheiden van presentatie

Posted on: October 15th, 2003 | Category: Xhtml/Css

Separate content from its presentation. One of the lingering mantras of web design and development. It exists as both a rule and a strategic practice. A commandment which promises rewards if followed. But have we iterated this phrase so much as to strip away its meaning? Have we lost sight of what it means to keep the two independent? And is the concept even a real possibility? Is it still merely a myth?

Is het eigenlijk wel mogelijk om je content totaal te scheiden van je presentatie?

Tekst kolommen verbinden met CSS

Posted on: October 13th, 2003 | Category: Xhtml/Css

Om nog even door te gaan op het linken van tekst-kolommen op het web uit de vorige post: Anne liet me weten dat ik niet de enige ben die hiermee bezig was: 1, 2, 3, 4 en ongetwijfeld etc, etc.

Het W3C heeft een working draft voor een CSS3 module opgesteld, om tekst kolommen aan elkaar te linken en tekst dus over te laten lopen naar volgende kolommen.

In het voorstel worden een aantal nieuwe properties ingevoerd, die volgens het W3C in drie groepen zijn in te delen:

Het aantal en de breedte van de kolommen:

  • column-count
  • column-width
  • column-min-width
  • column-width-policy

De witruimte tussen de kolommen:

  • column-gap
  • column-rule
  • column-rule-color
  • column-rule-style
  • column-rule-width

En tenslotte een property om een element over verschillende kolommen te strekken:

  • column-span

Een voorbeeld van hoe de css er uit zo komen te zien:

DIV {
  width: 320px;
  column-count: 3;
  column-width: 100px;
  column-gap: 10px;
  column-rule: none;
}

Om tot de totale breedte van de div te komen, moet de volgende optelsom gemaakt worden:

column_count * column_width + (column_count-1) * (column_rule_width) + (column_count-1) * column_gap)

Newer Entries »