. blog —

How to make a perfect Malevich using only basic HTML code (2006) - LUNK

— Share this Article —


marcin ramocki Sept. 11 2008 17:04Reply

Dragan Sept. 17 2008 08:53Reply

Error Line 9, Column 14: there is no attribute "HEIGHT".
<TABLE HEIGHT="100%" BORDER=0 ALIGN="center">

Pall Thayer Sept. 18 2008 13:33Reply

I see this is a bit dated. Here's a modern version. Fully valid XHTML 1.0 Tranistional.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="en-us" />

<style type="text/css">
body {
background-color: #FFF;
#outer {
position: absolute;
height: 400px;
width: 400px;
left: 50%;
margin-left: -200px;
border: 1px solid #000;
#inner {
position: relative;
top: 50px;
background-color: #000;
height: 300px;
width: 300px;
margin: auto;
<div id="outer">
<div id="inner">

t.whid Sept. 19 2008 10:42Reply

C'mon Pall! Where's the xhtml 1.0 strict version?


Pall Thayer Sept. 19 2008 11:07Reply

If you replace the instances of Transitional and transitional to Strict and strict in the DOCTYPE, this will validate as XHTML 1.0 strict. So there.

Pall Thayer Sept. 19 2008 13:35Reply

Here's another more modern version. The SVG version. Again, this is fully valid SVG 1.1

<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="600px" height="600px" version="1.1" xmlns="http://www.w3.org/2000/svg">
<desc>Malevich in SVG</desc>
<rect x="200px" y="200px" width="400px" height="400px" fill="#FFF" stroke="#000" stroke-width="1px" />
<rect x="250px" y="250px" width="300px" height="300px" fill="#000" />

I know that Firefox 3 and the current version of Opera will display this correctly with no need for plugins. Can't promise that other browsers will.