The power of slants

| Web Design | 0 Comments

If you too are into the power of Cascading Style Sheets (CSS) as much as I am, then you will really appreciate this little gem I happened to discover. At least, if you are as much of a die-hard Internet design geek as I am.

Have a good close look at the following so-called images:



So what do you think, I mean are you impressed? If you thought they are really images, then you were wrong. Sorry about that, but the figures above were purely generated not using embedded images but good old plain-vanilla CSS instead. Hard to believe but true.

Impressed? Well you shouldn't be, because they were merely built using slants. Here is how you can also use slants to make your web site even more amazing..

Place the following style declaration somewhere in the header section:

<style type="text/css">
.s1 {
  border-color:yellow green blue red;
  line-height:0px;
  width:0px;
  height:0px;
  border-style:solid;
}
</style>

And then, place the following code where you want the figures to appear:

<div class="s1" style="margin:10px;float:left;border-width:25px;"></div>
<div class="s1" style="margin:10px;float:left;border-width:19px 25px 31px;"></div>
<div class="s1" style="margin:10px;float:left;border-width:12px 25px 38px;"></div>
<div class="s1" style="margin:10px;float:left;border-width:6px 25px 43px;"></div>
<div class="s1" style="margin:10px;float:left;border-width:0px 25px 50px;"></div>

(Find out more about slants.)

It is even possible to create a heart made of CSS by using slant technology.

Here's to the power of CSS and the infinite possibilities.

Leave a comment

Random entries

Here are some random entries that you might be interested in:

Recent Assets

  • flitsfoto-B5H3-IoN-b9E4tr9OrFarmWfWrP5pxuN8AgYw45ABAnqqDrmjSqIc-KKoAQ9Bu_k.jpeg
  • flitsfoto-mjuWdZ1wBk6gJbu9rP7Bu6bETxZplWXFUoEJIA_HfMF0i0MQfgF_y5024mEsOBfH.jpeg
  • Kiffin-10th-hole-2017-05-small.jpg
  • Kiffin-10th-hole-2017-05.jpg
  • ember-rails-and-json-api.png
  • screenshot-www.golf.nl-2017-05-04-15-38-01.png
  • putting-mat.png
  • finished-just-in-time.png
  • Tenerife-flight-path.png
  • listen-to-me-marlon.jpg
  • sneeuwval.jpg
  • frozen-crystals.png

Golf Handicap

Information

This personal weblog was started way back on July 21, 2001 which means that it is 7-21-2001 old.

So far this blog contains no less than 2288 entries and as many as 1877 comments.

Important events

Graduated from Stanford 6-5-1979 ago.

Kiffin Rockwell was shot down and killed 9-23-1916 ago.

Believe it or not but I am 10-11-1957 young.

Began well-balanced and healthy life style 1-8-2013 ago.

My father passed away 10-20-2000 ago.

First met Thea in Balestrand, Norway 6-14-1980 ago.