Michel Vuijlsteke's weblog

Tales of Drudgery & Boredom.

Tag: css (pagina 1 van 2)

Links van 13 november 2015 tot 15 november 2015

Saudi Arabia’s Curriculum of Intolerance | Freedom House
"What is being taught today in Saudi public school textbooks about how Muslims should relate to other religious communities will poison the minds of a new generation of Saudis," said Nina Shea, Director of the Center for Religious Freedom and principal author of the report. "Whatever changes have been made in the Saudi educational system, clearly more needs to be done."

Tufte CSS
Tufte CSS provides tools to style web articles using the ideas demonstrated by Edward Tufte’s books and handouts. Tufte’s style is known for its simplicity, extensive use of sidenotes, tight integration of graphics with text, and carefully chosen typography. Tufte CSS was created by Dave Liepmann and is now an Edward Tufte project.

How Apple Is Giving Design A Bad Name
Today’s Apple has eliminated the emphasis on making products understandable and usable, and instead has imposed a Bauhaus minimalist design ethic on its products. Unfortunately, visually simple appearance does not result in ease of use, as the vast literature in academic journals on human-computer interaction and human factors demonstrates.

‘Amandeldrank is een hype: geen superfood en al helemaal gee… – De Standaard
Waarom we zwichten voor de verpakkingen van amandelmelk waar een knapperige noot wordt opengebroken en het sap eruit spat? ‘Omdat we gewoon een nieuwe hype hebben: meer moet je daar niet achter zoeken’, zegt professor Theo Niewold van de faculteit bio-ingenieurswetenschappen aan de KU Leuven. ‘Net zoals we enkele jaren geleden sojamelk “ontdekten”, zien we nu plots amandeldrank in reclames en kookboeken.’

Doing Something About the ‘Impossible Problem’ of Abuse in Online Games | Re/code
As a result of these governance systems changing online cultural norms, incidences of homophobia, sexism and racism in League of Legends have fallen to a combined 2 percent of all games. Verbal abuse has dropped by more than 40 percent, and 91.6 percent of negative players change their act and never commit another offense after just one reported penalty.

Links van 29 juli 2015 tot 7 augustus 2015

DUNE: The Insanely Complete 3-Hour Fan Cut
You think you’re a fan of Dune? Michael Warren has you beat. He put together this massive super-cut of David Lynch’s cult-classic 1984 film adaptation of Frank Herbert’s Dune comprised of footage from the original theatrical cut, the extended TV cut, and deleted scenes. This labor of fan love resulted in the following three-hour version. Originally done two years ago, an update earlier this year improved sound and video quality of the TV cut insertions.

The Five Characteristics of An Ideal SaaS Company – Redpoint Ventures
With more than 80% of venture capital investments occurring in enterprise and with the public markets disproportionately rewarding SaaS companies with huge enterprise value-to-revenue multiples (median is 7.6), it’s no surprise that interest Software-as-a-Service is booming. After meeting quite a few SaaS companies, I’ve compiled a list of my ideal characteristics for a SaaS business below.

Trello CSS Guide
Writing CSS is hard. Even if you know all the intricacies of position and float and overflow and z-index, it’s easy to end up with spaghetti code where you need inline styles, !important rules, unused cruft, and general confusion. This guide provides some architecture for writing CSS so it stays clean and maintainable for generations to come.

Why write Python in Visual Studio? – The Visual Studio Blog – Site Home – MSDN Blogs
Recently, Visual Studio 2015 was released with support for Python. Python Tools for Visual Studio (PTVS) are available to help throughout Visual Studio in all the places you’d expect, from editing and IntelliSense, to debugging, profiling, and publishing to Azure. You can find all the details and some video walkthroughs, documentation, and other resources on visualstudio.com, and the post announcing Python Tools 2.1 and Python Tools 2.2 beta. In this post I want to talk about some of the reasons to consider using Visual Studio next time you are working in Python.

Doing Terrible Things To Your Code
believe a key turning point in every professional programmer's working life is when you realize you are your own worst enemy, and the only way to mitigate that threat is to embrace it. Act like your own worst enemy. Break your UI. Break your code. Do terrible things to your software. This means programmers need a good working knowledge of at least the common mistakes, the frequent cases that average programmers tend to miss, to work against. You are tester zero. This is your responsibility.

Catholic-Hierarchy: Its Bishops and Dioceses, Current and Past
Current and historical information about its bishops and dioceses — heerlijke website

Links van 14 november 2013 tot 15 november 2013

The Algorithm That Thinks Like A Human ⚙ Co.Labs ⚙ code + community
“We should be careful not to underestimate the significance… of this milestone,” says Facebook cofounder Dustin Moskovitz, an advisor to a six-person startup that is reinventing artificial intelligence.

7 Fantastic Ways To Distinguish Between Sense And Nonsense
What can be said at all can be said clearly, and what we cannot talk about we must pass over in silence.

Hey, designer!
Curated articles and resources for web designers and developers.

Why the tech press is ignoring Zulily’s huge IPO – The Term Sheet: Fortune’s deals blogTerm Sheet
Zulily is profitable. It's also growing, with $439 million in revenue over the first nine months of 2013, compared to $202 million for the year-earlier period (and, of course, Q4 is when it makes its largest dollars). In other words, it's a real business. Bo-ring.

Google+ YouTube Integration: Kind of Like Twilight, Except In This Version When +Cullen Drinks BellaTube’s Blood They Both Become Mortal, But +Cullen Is Still An Abusive Creep, Also It Is Still Bad | Vi Hart
The choice between having to use Google+ and never commenting on YouTube again is laughably easy for me. I invested so much into my YouTube channel, and they’re taking that investment and threatening to throw it away if I don’t also start investing in Google+. No thank you Google, but you’ve already made me regret investing so much into you the first time. Do you really think I’m going to do it again?

Links van 25 juni 2012 tot 18 juli 2012

Aral Sea, ecological disaster: And it’s good night from the Aral Sea | The Economist
Every year five Central Asian states meet to discuss how to rescue the Aral Sea. In 2000 UNESCO produced a “water-related vision” for reviving the sea. The World Bank has restoration projects. But one development expert I spoke to in Tashkent, who has a deep attachment to the Aral Sea and Uzbekistan's adjacent region of Karakalpakstan, says the sea is “beyond redemption”. If the Amu Darya ran at full flow, he says, it would take 75 years for the sea to refill.

The Cyclops Child | Psychology Today
I rotated onto pediatrics a few days later, and the baby was still there. Still alive. Because it did not look like a human being, most of the time no one was disturbed by it; until it cried! Then it sounded like any other baby. It was hungry, and it could not be fed. Picking it up would not stop the crying. After a while, the staff spent as much time as possible on the other end of the ward. It was agonizing to me. Human beings are not constructed to listen to a crying baby and do nothing. And I felt sorry for the nurses and the rest of the staff. As the days went by without the baby dying, I began to wonder, just how long can a baby live without being fed? I did not know. Every day, when I went to the ward I hoped the baby would be dead, but it lived on.

Everyone is John
Everyone is John is a humorous, competitive roleplaying game about playing the various personalities of John, an insane man from Minneapolis. One participant is the GM, or, in Everyone is John lingo, "Everyone Else." All of the other players are Voices in John's head.

A List Apart: Articles: Building Books with CSS3
While historically, it’s been difficult at best to create print-quality PDF books from markup alone, CSS3 now brings the Paged Media Module, which targets print book formatting. “Paged” media exists as finite pages, like books and magazines, rather than as long scrolling stretches of text, like most websites. CSS3 allows us to style text, divide it into book pages, and set the page structure as a whole.

EduRatio – Hoogbegaafdheid als levenslange eigenschap?
In de jaren dat hoogbegaafdheid op de agenda kwam te staan in het Nederlandse en Vlaamse onderwijs, namen wij, geïnspireerd door deze moderne inzichten, juist afscheid van dat begrip.

Links van 11 februari 2012 tot 22 februari 2012

If PHP Were British – Added Bytes – Brighton Web Application Development
The first, but maybe the most important, of many changes that will allow PHP to achieve a more elegant feel is to remove that symbol so beloved by the US and replace it with something altogether more refined. More solid. More … sterling.

Freaky (Factual) Tale Friday: If you hear voices in your head, they might actually be real ~ RamblingBeachCat.com
In other words, the United States Army had successfully developed the technology to transmit voices into a person's head.

The Odd Couple: Romney Vs. Gingrich | Politics News | Rolling Stone
If Romney is a scripted automaton who could make it through a year's worth of marital coitus without one spontaneous utterance, Gingrich is his exact opposite – taken prisoner in war, Newt would be blabbing state secrets without torture within minutes, and minutes after that would be calling his guards idiots who lack his nuanced grasp of European history, and minutes after that would be lying to two of his captors about an affair he had with the third.

Creating Triangles in CSS « Jon Rohan’s Web Developer Field Guide

Apple’s File System APIs | Rixstep’s The Technological
Try any of that on a Windows box and Cutler tells you where to get off. But in the world of Apple there is no sanity checking whatsoever: any line of rogue code in any program written by any programmer in the world can contain a bug that hoses the entire system. And that bug can be prevalent or latent and only once in a great while manifest itself. And users can go on for the longest time blissfully unaware.

Links van 12 november 2011 tot 5 december 2011

Arcade Improv: Humans Pretending to Be Videogames – Waxy.org
Instantly, Mike and Jerry understood, along with everyone in the audience born before 1978.

Catherine Young & Family, Page One
A family working in the Tifton (Ga.) Cotton Mill. Mrs. A.J. Young works in mill and at home. Nell (oldest girl) alternates in mill with mother. Mammy (next girl) runs 2 sides. Mary (next) runs 1 1/2 sides. Elic (oldest boy) works regularly. Eddie (next girl) helps in mill, sticks on bobbins. Four smallest children not working yet. The mother said she earns $4.50 a week and all the children earn $4.50 a week. Husband died and left her with 11 children. 2 of them went off and got married. The family left the farm 2 years ago to work in the mill. January 22, 1909. Location: Tifton, Georgia. Photo by Lewis Hine.

Sass – Syntactically Awesome Stylesheets
Sass makes CSS fun again. Sass is an extension of CSS3, adding nested rules, variables, mixins, selector inheritance, and more. It’s translated to well-formatted, standard CSS using the command line tool or a web-framework plugin.

Memoires of a Heroinhead
It was over a year that I had been in France. I had gotten clean and then gotten dirty again. So it was good news one day when my mother phoned.

“Shane, there's a little surprise coming over your way! That fucking Irish John has just been around here, bought me two rocks of white and left twenty five quid to get you three of choice and post over. And you ya little bastard, you never told me he 'ad AIDS! An I've been sharing my fuckin' crackpipe with 'im!”

SFE: Science Fiction Encyclopedia
Welcome to the beta text of the third edition of The Encyclopedia of Science Fiction. Some sample entries are below. Alternatively, you can browse the Encyclopedia through the search box above or the categories in the grey bar above.

Paris Review – The Grand Map, Avi Steinberg
“And then came the grandest idea of all! We actually made a map of the country, on the scale of a mile to the mile!”
“Have you used it much?” I enquired.
“It has never been spread out, yet,” said Mein Herr. “The farmers objected: they said it would cover the whole country, and shut out the sunlight! So we now use the country itself, as its own map, and I assure you it does nearly as well.”

Final report of the commercial starship Nostromo, third officer reporting. | MetaFilter
The Nostromo model from the first Alien movie sat outside in the rain for over two decades before it was bought by The Prop Store in 2007. They sent it to Grant McCune Design to restore it to its previous glory.

GROGNARDIA: Retrospective: Barbarian Prince
If you're the least bit curious about Barbarian Prince, you can download a legal copy for free here.

Nate Hallinan Portfolio
The Smurf is actually the result of a symbiotic relationship
between two organisms. We believe that Smurfs put their
'embryos' in the button of a developing mushroom. From a
distance, Smurfs seem like they are wearing a hat and pants
but as you can see this is a fallacy. The fungus provides
camouflage and protective epidermal layers for the creature,
while the creature provides nutrients and mobility for the
spreading of spores.

Research:Wikimedia Summer of Research 2011/Summary of Findings – Meta
This is the summary of findings from the Wikimedia Foundation Summer of Research, a program in the Foundation's Community Department which brought together eight academic researchers from around the globe to study the dynamics of the Wikipedia editing community.

How Star Wars Should Have Ended: Reflections on Taste, The Expanded Universe & Radical Politics « Human Iterations
Basically a totalitarian Empire makes sense, a rotting and unsustainable Republic makes sense, a teemingly complex anarchic and increasingly more nomadic post-collapse culture also makes sense.  But a more or less decent galactic-sized democracy instantly formed and accepted out of the goodness of all the Rebel’s hearts?  Totally unbelievable.  And basically a stubborn Liberal lack of imagination.

Main § Digital Atlas of Roman and Medieval Civilization
The Digital Atlas of Roman and Medieval Civilization (DARMC) makes freely available on the internet the best available materials for a Geographic Information Systems (GIS) approach to mapping and spatial analysis of the Roman and medieval worlds. DARMC allows innovative spatial and temporal analyses of all aspects of the civilizations of western Eurasia in the first 1500 years of our era, as well as the generation of original maps illustrating differing aspects of ancient and medieval civilization.

Hugo Blogging – Connie Willis May Be The Worst Writer In Existence « Sci-Ence! Justice Leak!
"I have now discovered a way to produce a masterpiece. Just read Blackout/All Clear by Connie Willis, do the exact opposite of what she does, and you will have the greatest work in the history of English literature." (Come come now – surely it can't be much worse than Dan Brown?)

The sad, sad demise of Greenpeace | COSMOS magazine
GREENPEACE WAS ONCE a friend of science, helping bring attention to important but ignored environmental research. These days, it’s a ratbag rabble of intellectual cowards intent on peddling an agenda, whatever the scientific evidence.

The 1140px Grid · Fluid down to mobile
The 1140 grid fits perfectly into a 1280 monitor. On smaller monitors it becomes fluid and adapts to the width of the browser.

A cherry picking tale, and an update on spinal manipulation science « Alternative Medicine « Health « Skeptic North
Spinal manipulative therapy (SMT) has long enjoyed a solid reputation for the treatment of so-called “mechanical” low back pain, and is widely used by physical therapists as well as chiropractors. Even skeptics tend to give it a pass, regarding it as the one thing chiropractors offer that we don’t really have a complaint with, much the way we used to think maybe acupuncture had something going for it, until better evidence crushed our optimism. For instance, just recently Dr. David Gorski — as tough-minded a quackery critic as they come — casually mentioned that “no one argues that … manipulative therapies can’t help back pain.” Actually, skeptics who’ve been following the SMT science are now arguing exactly that.

Historical Meet-Ups –   Samuel Beckett Playwright, novelist, and Nobel…

The price of ebooks – oxylogos.com
Think the book industry learned from the mistakes the music and film industry made?

Guess again.

They are quickly heading to the top of the charts of sheer stupidity. And what they don't realise is that, unlike the movie industry and—though to a somewhat lesser extent— the music industry, they have even less of a legitimate ‘raison d'être’ than their counterparts in those industries.

Gigawatt {The Illuminated Mixtapes}
Gelijk een statische versie van http://musichunterapp.com/ en door echte mensen gedaan.

Villa La Vigie – Koksijde – Bezoeker
Na de oorlog werden de twee bunkers ontdaan van alle uitrusting en rails. De twee bouwwerken fungeerden een tijdje als toeristische bezienswaardigheid. Begin de jaren '20 werd één van de bunkers afgebroken. Rond 1923 kreeg aannemer Remi Rys uit Koksijde de opdracht om boven de resterende bunker een villa te bouwen en de bestaande oorlogsconstructie te integreren in het nieuwe project.

Lernert & Sander: Natural Beauty – NOWNESS
Mission Statement: We wanted to apply 365 layers of makeup in one day to see how much is needed to go from a natural look to an outrageous one.

A celebration of the writing and art of Mervyn Peake | Books | The Guardian
Mervyn Peake, creator of Gormenghast, is now recognised as a brilliant novelist and artist. Michael Moorcock, China Miéville, Hilary Spurling and AL Kennedy celebrate his achievements

Extinguishing and Understand Barking Dog Behavior
If your dog barks and you yell at him to shut up, you are reinforcing the barking.

Top 5 Ways to Build a WordPress Site that’s Easy for Your Clients
Here are our top 5 tips for simplifying the WordPress back end so that your clients will find it much easier to use, and you will find it much easier to teach them how to use it!

Restoring a Photograph from the 1870sTop Dog Imaging
"From here, I began the laborious process of restoration, which involved a prodigious amount of retouching. The process took about four hours." Of hoe een mens een uitgebreide post kan schrijven met veel beeldjes erbij, en op Kottke vermeld worden en alles — met rotslecht werk.

Dissecting an Episode of MythBusters
27% of the time is spent watching advertising.

Modernist Cuisine: The Art and Science of Cooking
"The most important book in the culinary arts since Escoffier" — Modernist Cuisine is a six-volume, 2,438-page set that is des­tined to rein­vent cook­ing. The lav­ishly illus­trated books use thou­sands of orig­i­nal images to make the sci­ence and tech­nol­ogy clear and engaging.

How Apple re-cut Final Cut Pro for the better | Video | Creative Notes | Macworld
It's not dumbing down, it's targeting

Jennifer Pournelle’s The Mote in God’s Eye sequel actually looks interesting | Wis[s]e Words
Intriguing — de dochter van de meneer van Chaos Manor schrijft een vervolg: "Sequels written to well loved science fiction classics by the children of the original writer never turn out right therefore you can safely ignore them. It’s a rule that saved me a lot of frustration, but I think I might break it for Jennifer Pournelle’s Outies, a sequel to her father’s and Larry Niven’s The Mote in God’s Eye. "

Zo, dat zijn veel vissen! :: nrc.nl
Bloody hel. Scary! "Sinds enige tijd hebben Amerikaanse wateren, met name de Mississippi en haar aftakkingen, bezoek van de Aziatische karper. In 2010 begon dat bezoek onaangenaam te worden."

My Opposition – Wikipedia, the free encyclopedia
After the war many Germans would insist they knew nothing at all about The Holocaust. More recently, Holocaust deniers have questioned the extent, and even the existence of the Holocaust. Friedrich Kellner's diary counters such suggestions.

Fietsherstel Aan Huis | omdat service belangrijk is !
Heeft uw fiets een lekke band, is de verlichting defect, of heeft uw fiets andere gebreken?
U kocht uw fiets in een grootwarenhuis, waar geen herstellingen mogelijk zijn?
U heeft een tandem, bakfiets, elektrische of andere fiets met extreme afmetingen?
Wilt u geen beschadigingen meer aan de kofferbak van de auto?

Dan kunt u gebruik maken van een unieke service: wij komen uw fiets bij u herstellen.

N Korean children begging, army starving: exclusive – ABC News (Australian Broadcasting Corporation)
Footage shot inside North Korea and obtained by the ABC has revealed the extent of chronic food shortages and malnutrition inside the secretive state.

History Cookbook – Cookit!
Welcome to the history cookbook. Do you know what the Vikings ate for dinner? What a typical meal of a wealthy family in Roman Britain consisted of, or what food was like in a Victorian Workhouse? Why not drop into history cookbook and find out? This project looks at the food of the past and how this influenced the health of the people living in each time period. You can also try some of the recipes for yourself. We have a wide range of historical recipes from Brown Bread Ice Cream to Gruel (Why not see if you would be asking for more – just like Oliver Twist).

Dear Emma B : Pharyngula
Schoon — The question you can always ask is, "How do you know that?"

Everything You Think You Know About the Collapse of the Soviet Union Is Wrong – By Leon Aron | Foreign Policy
Every revolution is a surprise. Still, the latest Russian Revolution must be counted among the greatest of surprises. In the years leading up to 1991, virtually no Western expert, scholar, official, or politician foresaw the impending collapse of the Soviet Union, and with it one-party dictatorship, the state-owned economy, and the Kremlin's control over its domestic and Eastern European empires. Neither, with one exception, did Soviet dissidents nor, judging by their memoirs, future revolutionaries themselves. When Mikhail Gorbachev became general secretary of the Communist Party in March 1985, none of his contemporaries anticipated a revolutionary crisis. Although there were disagreements over the size and depth of the Soviet system's problems, no one thought them to be life-threatening, at least not anytime soon.

the A.I. is a lie » #AltDevBlogADay
I can tell you right now there is no I in A.I., and nor should there be.

Arrested Westeros
What happens when Game of Thrones meets Arrested Development.

Verdediging Belfortploeg zaterdag 18 juni | Belfort ploeg
Ik zou bijna sympathie krijgen voor Francis Van den Eynde c.s.

Hot Dudes with Kittens from Funny Or Die, Sam Trammell, Romany Malco, Sean Carrigan, Mark Valley, Matt Dallas, Tanc Sade, Matt Lanter, Ryan Eggold, Chad Faust, ellhoof, and Shauna O’Toole
Who doesn't love hot men holding cats and kittens? Oh you don't? Too bad, this one is… for the ladies.

GET LAMP: John Romero Interview : Jason Scott : Free Download & Streaming : Internet Archive
Romero's path crossed with Infocom's in the late 1980s; while working for a company he co-founded called Ideas From the Deep, he wrote an operating system for the Apple II that was used in the last round of Infocom games: Journey, Shogun, Zork Zero, and Arthur. He didn't get to meet anybody but he was proud of his contribution and offered to be interviewed.

bradley’s almanac – the sims torture test (a mirror site)
I guess people actually play this game to make their little sims happy. I'll admit that i did that for awhile, but to be honest, it just got boring. So of course I reverted to my typical gaming pattern of torturing innocents to death.

Coilhouse » Blog Archive » Resonance: Where Sound Meets Geometry
In this 11-minute clip, a group of over 30 animators and sound artists teamed up to create short pieces between 12 and 20 seconds with the aim to ”explore the relationship between geometry and audio in unique ways.”

YouTube – Prora-Das erste KdF bad
Kraft durch Freude.

CK01 Standard/Honors Chemistry Kit – Home
Droool. Ik zou mijn linkerarm gegeven hebben voor zoiets als ik klein was: "Because chemistry is widely considered to be the most difficult lab course to do well—particularly on a tight budget—we offer the CK01 Standard/Honors Home School Chemistry Laboratory Kit. It provides a comprehensive, rigorous laboratory component for a first-year high school chemistry course, and does so affordably. With the exception of standard household items (such as table salt, sugar, vinegar, aluminum foil, foam cups, and so on) and other minor items that are readily available locally, the kit contains all of the special equipment and chemicals you'll need for a complete chemistry lab course."

Michele Bachmann’s Holy War | Rolling Stone Politics
Bachmann lies because she can't help it, because it's a built-in component of both her genetics and her ideology. She is at once the most entertaining and the most dangerous kind of liar, a turbocharged cross between a born bullshit artist and a religious fanatic, for whom lying to the infidel is a kind of holy duty.

What is International Baccalaureate?
Hierzie, dat ge 't weet: "IBO lumps Christianity … into the category of what it calls "fundamentalism" — along with the Taliban and various terrorist groups, saying that these "fundamentalist" groups are all "dangerous." It would be difficult to imagine a more clear, and repugnant, attack on Christianity." "While IBO undermines Christianity, it also advocates its own religion. IBO promotes the worldview of New Age-Pantheism guru William Butler Yeats … Another New Age leader, Joseph Campbell, is often required reading for IBO students. Like Yeats, Campbell aggressively promotes "inclusive" New Age-Pantheistic doctrines while undermining Christianity."

Er zijn toch rare mensen in de wereld.

Wikipedia talk:Dispute resolution – Wikipedia, the free encyclopedia

Talk:Circumflex – Wikipedia, the free encyclopedia
WHOEVER IS IN CHARGE HERE MUST IMMEDIATELY TRANSMIT THIS URGENT ESSENTIAL ERROR/FEIL TO GOOGLE-TRANSLATE, which I have just noticed myself today, 18, May, 2011, Anoo Domini, which is AN INEXCUSABLE ERROR, without PRECENT in ALL of the history I have used Google-translate for all sorts of purposes and reasons.

Links voor 9 maart 2011

Watch Star Trek Episodes Free Online – Watch Original Series, Next Generation, Deep Space Nine, Voyager, Enterprise
Welcome to Watchtrek! We consider it our duty to provide every episode of Star Trek ever made totally free. It should be too good to be true. But it's not.

Flickr: Lord Dane’s Photostream
Serieus proper gemaakte lego-dinges. Awoert al wie zegt dat er met die nieuwerwetse lego's geen creativiteit meer mogelijk is en dat alles gemaakt moet worden zoals het op de doos staat.

CSS Border Tricks with Collapsed Boxes » Yahoo! User Interface Blog (YUIBlog)
These tricks will help you achieve designs without resorting to the use of images, CSS3 gradient or extraneous markup. By collapsing boxes with zero line-height and height values, we can display content outside of the content box, over borders.

Method & Craft
Proper gedaan — "We like to think of Method and Craft as the DVD extras of design: the stories behind the work, who made it, how they did it, and the techniques people have developed throughout their professional career. We all use the same tools, but we use them differently. We strive to educate you on more efficient, creative, and engaging ways to create your design. This site will not only be valuable to creative veterans, but also educational to those new to the design field. It's like looking over the shoulder of your favorite designer."

CSS Systems


CSS Systems

View SlideShare presentation or Upload your own. (tags: barcamplondon5 html)

PDF met uitleg alhier.

Kunsten en erfgoed

Wil iemand mij eens zeggen voor welke browser deze website geoptimaliseerd is? Alstublieft?




Akkoord, als ik .small_interlinie {line-height:1.3em; } zet in plaats van .small_interlinie {line-height:0.3em; }, dan neemt het allemaal meer plaats in op de pagina.

En als ik .homebox, #nieuws  { background-color: #fff !important; } geef in plaats van die schuine lijntjes, dan wordt het misschien wat té leesbaar, maar toch. Maar toch.


CSS Confessions

Confessions of a CSS developer, via alhier (en ja, ik zal dan binnenkort eens iets over css schrijven, want moeilijk is dat ook niet, eigenlijk):

  1. I passionately use the * {margin:0; padding:0} rule. Sometimes I feel rebellious and add border:0
    Nah. Meestal reset en fonts van YUI.
  2. Everything before IE6 is dead to me
    Yep. Voor persoonlijke dingen: vergeet die ouwe brol.
  3. I couldn’t care less if my css validates or not
    Och, ik lig er niet van wakker, maar ik kijk het toch altijd eens na.
  4. I am in love with :hover and use it extensively for unusual layout stuff
    Neuh, niet echt.
  5. I still have to look up the correct definition order for some shorthand notations
    Dat is tegenwoordig niet echt meer het geval, toch niet voor die dingen die ik regelmatig gebruik. Euh, dus het is eigenlijk wel het geval, dus. 🙂
  6. I occasionaly throw in advanced CSS3 stuff just to show off
    Nah. Nog niet echt naar gekeken, eigenlijk zelfs. Ik zal het dan wel zien als het werkt.
  7. I still have no clue what design showcase sites like CSSMania have to do with CSS
  8. I still think CSS is hard to master
    Nee. Een misvatting. CSS is niet moeilijk. Logisch nadenken, een beetje, en vooral: met een open geest naartoe gaan en niet moeilijker doen dan nodig.
  9. I’m a sucker for one-line definitions
    Soms. Ik doe meestal
    dink {
       spel: gerief;
       anderdink: trala;
  10. I would never ever optimize my css code by comprimising on readability
    Da’s een recept voor onheil. Maar ik doe het natuurlijk wel soms. 🙂
  11. I comment my stylesheets way too much
    Te weinig, eigenlijk. Ik begin altijd met goeie bedoelingen, maar het loopt verkeerd af.
  12. I love Adobe Dreamweaver and I think there’s nothing comparable for optimizing your web development workflow
    Notepad++, Web Developer Toolbar en Firebug. Dreamweaver is overschat en overkill.
  13. I have a huge cheat sheet with all the CSS 3 selectors on my wall behind my screen
    Euh… Google, iemand?
  14. I have a php script that basically crawls a website/project and creates a css file with all html tags, divs and classes
    Ik maak ze allebei samen, meestal, html en css.
  15. I am guilty of using old school html tables for specific scenarios
    Nee. Het is al een eeuwigheid geleden dat ik nog een tabel voor lay-out van niet-tabulaire gegevens gedaan heb. Gelijk, járen geleden.
  16. I will seriously cry when all browsers fully support CSS 3
    Ik zal dat dan wel zien.

Heh. Lijstjes zijn wijs.

Like assholes

Wat ze over opinies zeggen: dat ze gelijk achterwerken zijn, in dat iedereen er één heeft. Daar is iets voor te zeggen, natuurlijk, en iedereen zijn waarheid ook.

Ik heb respect voor veel opinies: of deze dan wel gene muziekgroep, schilder, dichter, schrijver, beter is. Of Guernica lelijke brol is dan wel geniaal, dat soort zaken.

Maar hoe ouder ik word, hoe vreemd genoeg méér stellige overtuigingen ik heb, en hoe minder ik voor sommige zaken bereid ben om te relativeren. En ik die dacht dat het net de jeugd was die in absoluten denkt, en de oudere jongere die het allemaal in een ruimer perspectief ziet.

Het kan zijn dat ik binnen een jaar of tien opnieuw milder ga worden, maar nu: nee dus. Mijn bloed kan koken als ik mensen manifest verkeerde dingen hoor verkondigen, of manifest onrecht zie gebeuren, of manifest idiotieën weet gebeuren.

“Manifest” volgens mij, natuurlijk, dat spreekt.

Deze opinie over conditional comments maakte mij helemaal spinnijdig: hoe kan iemand zó verkeerd zijn?

Waar het over gaat. Webpagina’s worden tegenwoordig voor het grootste deel structuur gegevenin HTML en vorm in CSS. Allerlei verschillende browsers interpreteren die CSS op allerlei verschillende manieren. Soms helemaal anders, soms subtiel anders. Internet Explorer doet notoir moeilijk, vaak.

En dan zijn er ruwweg drie mogelijkheden om daar mee om te gaan:

  1. Niets doen, ‘t is te zeggen, één versie maken van de CSS-file en ervoor zorgen dat alles zo goed en zo kwaad mogelijk in alle browsers goed werkt,
  2. conditionele comments gebruiken,
  3. css hacks gebruiken.

De meneer van de link hierboven zei, ondertussen trouwens een hele tijd geleden, ik ben er maar op gevallen via een recentachtig artikel op A List Apart, dat conditionele comments evil zijn.

Die dingen zien er zo uit:

<link rel="stylesheet" href="styles.css" />
<!--[if lt IE 7]>
<link rel="stylesheet" href="ie.css" />

Laad in alle geval styles.css in, en als het een andere browser is dan Internet Explorer, dan staat de rest uitgecommentarieerd: <!-- is het begin van een comment, –> het einde. Enkel Internet Explorer doet iets met die [if] en [endif], in dit geval: als de browser een versie van Internet Explorer minder dan 7 is, laad dan ie.css in.

Dus met andere woorden: het gros van de css staat in styles.css, en voor die paar dingen waar het in Internet Explorer 5 en 6 de mist in gaat, staan de uitzonderingsregels gespecificeerd in ie.css.

Proper, toch? En binnen een paar jaar zal dat nog altijd werken, want geen enkele andere browser zal ooit diezelfde syntax gebruiken: in het slechtste geval is het een comment en wordt het allemaal links gelaten.

En wat stelt die Jens Meiert? Dat CSS hacks te verkiezen zijn boven conditionele comments. Dat is zó verkeerd, zo patent absurd, zo nonsensicaal, dat ike r haast geen woorden voor heb.

CSS hacks werken door bugs te exploiteren in de verschillende implementaties van CSS door de verschillende browsers. Ze maken de CSS onleesbaar wegens overal verspreid en uit hun aard lelijk, en ze zijn onbetrouwbaar want (a) de bugs in kwestie kunnen uiteraard gefixed worden — wat gebeurde met Internet Explorer 7, die maakte gehakt van zowat alle hacks — en (b) ze zorgen voor nachtmerries omdat het nooit duidelijk is welke hack nu precies in welke browser wat deed, en hoe een bepaalde hack andere dingen al dan niet gaat breken.

Een voorbeeld van zo’n ding:

strong { color: #f00; } 
html:not([dummy]) strong { color: #0f0; }
@media all and (min-width: 0px) { strong { color: #00f; } }

Die eerste regel zorgt ervoor dat in Internet Explorer <strong> rood zal zijn, de tweede dat <strong> in Firefox en Safari groen zal zijn, en die derde dat <strong> in Opera blauw zal zijn. A la bonne heure!

Nog een voorbeeld, de box model hack:

.meta { 
  width: 300px; 
  voice-family: "\"}\""; 
  width: 250px;
html>body .meta {

Dat zorgt ervoor dat pakweg een div met class=“meta” op Internet Explorer (5.0–6.0) 300 pixel breed is en op Firefox en Opera en zo 250 pixels. En in het “echt” zullen ze dan misschien allemaal even breed uitzien, wegens een afwijkende manier van met border om te gaan.

O ja, absoluut. Véél eenvoudiger.

Nijdig word ik daarvan.

All’s well that ends well

Oh boy. Ik voelde mij helemaal lastig: ik had een paar dingen verkeerd begrepen, nog een paar dingen niet volgens mij goesting gedaan, en nóg een paar andere dingen was ik gewoon uit het oog verloren.

Jongens en meisjes: minofmeer complexe code schrijven, of dat nu xhtml/css of echt programmeren is, dat doet men best niet ergens tussen de soep en de patatten, als het eens past. En ook best niet terwijl er een aantal collega’s over en weer aan het babbelen zijn aan dezelfde tafel. En ook niet ‘s avonds laat na de gewone dagtaak.

Daar geraakt men best voor in the zone, en dat doet men best uitgerust, en van het begin tot het gedaan is, in daar speciaal voor opzij gezette dagdelen.

Ik had vandaag, eigenlijk geheel onverwacht, een quasi-volledige dag op overschot: één project op minder tijd dan verwaht klaar gekregen, een interview dat dronderdag zou gebeuren en tot werk zou geleid hebben vandaag, uitgesteld tot 4 januari.

En dus is het vandaag quasi-klaargeraakt. En content dat ik ben.

Kan ik de vakantie tegemoet met een opgeklaard gemoed. Hoera!


Bleh, ik ben kwaad op css. Ik probeer twaalf menu-items in een tabelachtig iets te steken met <ul><li>’s. Met een tabel zou het op vijftien seconden gedaan zijn. Bah.


Een snelle blik op de statistieken leert me dat er eigenlijk niet zo enorm veel veranderd is, qua browser share, in het afgelopen jaar:


Tot spijt van wie het benijdt: 69% Internet Explorer, 35% Firefox, 3% Safari, en al de rest samen—Opera, Mozilla, Netscape, Camino, Konqueror e tutti quanti—minder dan één percent. En daar zitten ook alle onbekende browsers en robots en search engines in.

Voor mijn recent uitzicht-rond-geshuffle wil dat wel zeggen dat de grote meerderheid (die 59% Internet Explorer 6–gebruikers) de rechterbalk niet meer rechts ziet staan maar wel ergens onderaan de pagina (merci Laurens voor het melden). Dat mag de bedoeling niet zijn natuurlijk. Ik heb het in de rapte aangepast: 10 pixels minder padding rechts op #weblog, conditional comments zijn uw vriend.. 😀

Ways to skin a cat

In HTML en in Photoshop en in het leven in het algemeen is het soms gelijk in perl: TMTOWTDI.

Sinds ik release candidate 1 van Internet Explorer 7 geïnstalleerd had, werkte dit niet meer:

img.gravatar {
float: left;                /* beeldje links zetten */
width: 80px; height: 80px;  /* expliciet 80x80 pixels */
padding: 3px;               /* randje van 3 pixels… */
background-color: #fff;     /* …in het wit */
border: 1px solid #ccc;     /* en daarrond een grijs lijntje */
margin: -4px 8px 8px -95px;

Dat zet een beeldje links van de commentaartekst die ernaast staat. Die commentaartekst had een linkermarge van 95 pixels, en met die negatieve marge op het beeld, kwam dat mooi uit dat het beeldje vóór de tekst stond.

In IE7RC1 lukte dat niet meer, stond het beeld in de tekst. Ik heb eerlijk gezegd niet veel zin om er ernstig naar te kijken, dus een beetje gefutzt om te zien of het in de rapte anders kon opgelost krijgen, en jawel hoor.

De gewijzigde regels:

img.gravatar {
float: left;
width: 80px; height: 80px; 
padding: 3px;
background-color: #fff;
border: 1px solid #ccc;
margin: -4px -85px 8px 0;
position: relative;
left: -95px;


Relatief gepositioneerd, linkerkant 95 pixels vóór het begin van het ding waar het in zit (een <li> met een linkermarge van 95 pixels), euh, en dan nóg eens 85 pixels naar links.

Bring on the css nazis!

Geschreven al luisterend naar: Bill Evans – The Last Waltz (Disc 5) – Someday My Prince Will Come

Oudere berichten

© 2018 Michel Vuijlsteke's weblog

Thema gemaakt door Anders NorenBoven ↑