JSFiddle - React, Tailwind, and code Playground

by Zeya

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">


<html xmlns="http://www.w3.org/1999/xhtml" 
xml:lang="<?php echo $this->language; ?>" 
lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>" >
<head>
<jdoc:include type="head" />
<title>Welcome to the Frontpage</title>
<meta name="description" content="Joomla! - the dynamic portal engine and content management system" />
<meta name="generator" content="Joomla! 1.5 - Open Source Content Management" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="robots" content="index, follow" />
<meta name="keywords" content="joomla, Joomla" />
<link href="index.php?option=com_content&amp;view=frontpage&amp;format=feed&amp;Itemid=1&amp;type=rss" rel="alternate" type="application/rss+xml" title="RSS 2.0" />
<link href="index.php?option=com_content&amp;view=frontpage&amp;format=feed&amp;Itemid=1&amp;type=atom" rel="alternate" type="application/atom+xml" title="Atom 1.0" />
<script type="text/javascript" src="http://localhost/Joomla-1.5RC2/media/system/js/mootools.js"></script>
<script type="text/javascript" src="http://localhost/Joomla-1.5RC2/media/system/js/caption.js"></script>

<link rel="icon" href="/templates/persik/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="/templates/persik/favicon.ico" type="image/x-icon"> 

<link rel="stylesheet" href="/templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="/templates/system/css/general.css" type="text/css" />
<link rel="stylesheet" href="templates/<?php echo $this->template ?>/css/template.css" type="text/css" />

<?php

if($this->countModules('right') == 0) $contentwidth = "100";

if($this->countModules('right') == 1) $contentwidth = "80";

?>
</head>

<body>
<!--оформление страницы сайта-->
<div id="wrap">
<!--блок шапки сайта header -->
<div id="header">
             <jdoc:include type="modules" name="top" style="xhtml"...

CSS

body, html {
background-color: #38616b; 
margin:0px;
padding:0px;
}

#wrap{
width: 1024px;
margin:0 auto;
}

#header {
background: url(../images/header.jpg) no-repeat;
width:1001px;
height: 222px;
margin:0 auto;
}

#topmenu{
background: url(../images/menu_fon.jpg) no-repeat;
width:1001px;
height: 55px;
}

#body{
width:100%;
}

#content {
background: url(../images/fon_left.jpg)  repeat-y;
width: 767px;
}

#right {
background: url(../images/fon_right.jpg)  repeat-y;
width: 232px;

}

#bottom {
background: url(../images/bottom.jpg) no-repeat;
width:999px;
height: 120px;
margin:0 auto;
padding-bottom: 35px;
padding-top: 116px;
text-indent: 16em; /* Отступ первой строки */
color: #3d6a55;
}