| webcrawler2050 |
29-10-2009 01:17 |
HTML / CSS Assistance
Evening,
I'm having some real issues with Joomla and it's templating system. Basically, I have a veyr large white gap under my footer ( http://sheerclasscats.co.uk/index.php) and just cant find it - i've been looking at it for a few hours now, so a "second" set of eyes would go a miss.
The Template
Code:
<?php
if (!defined('e107_INIT')) { exit; }
// [multilanguage]
@include_once(e_THEME."Buzzness/languages/".e_LANGUAGE.".php");
@include_once(e_THEME."Buzzness/languages/English.php");
// [theme]
$themename = "Buzzness";
$themeversion = "1.0";
$themeauthor = "Design by:<a href='http://www.wearepc.co.uk'>MK5 Ltd</a>";
$themeemail = "http://www.wearepc.co.uk";
$themewebsite = "http://www.wearepc.co.uk";
$themedate = "10/09/2009";
$themeinfo = "";
define("STANDARDS_MODE", TRUE);
$xhtmlcompliant = false;
$csscompliant = false;
define("IMODE", "lite");
define("THEME_DISCLAIMER", "<br /><i>".LAN_THEME_1."</i>");
if(!defined("e_THEME")){ exit; }
$page=substr(strrchr($_SERVER['PHP_SELF'], "/"), 1);
define("e_PAGE", $page);
// [layout]
$layout = "_default";
$HEADER = "
<div id='wrapper'>
<div id='header'>
<h1><img src='".THEME."images/logo.jpg' width='556' height='130' alt='Maine coons Wiltshire'></h1>
</div>
<div id='headline'>
<div id='photo'><div>
<a href='/page.php?6'><img src='".THEME."images/top.jpg' width='250' height='116' alt='SheerClass'></a>
</div>
</div>
<div id='search-news'>
<h2>Search this site</h2>
<form method='get' action='search.php'>
<div><input type='text' name='q' value='' id='q' /></div>
<div class='more'><input type='image' name='search' value='' src='".THEME."images/search.jpg'>
<input type='hidden' name='r' value='0' /></div>
</form>
<h3 class='downcast'>MENU</h3>
<div id='news-box'>
<ul>
{SITELINKS}
</ul>
</div>
</div>
<div class='clear'></div>
</div>
<div id='body'>
<div id='body-left'>
";
$FOOTER = "
</div>
<div id='body-right'>
{SETSTYLE=menu1}
{MENU=1}
</div>
<div class='clear'></div>
</div>
</div>
<div id='footer'>
<p><a href='page.php?7'>Maine Coon Cats</a> | <a href='page.php?6'>Maine Coon kittens for sale</a> | <a href='contact.php'>Maine Coons Wiltshire</a></p>
<p>Created by: <a href='http://www.wearepc.co.uk'>MK5 Limited</a> </p>
</div>
";
$CUSTOMHEADER = "
<div id='wrapper'>
<div id='header'>
<h1><img src='".THEME."images/logo.jpg' width='556' height='130' alt='Sheerclass'></h1>
</div>
<div id='headline'>
<div id='photo'><div>
<a href='/page.php?6'><img src='".THEME."images/top.jpg' width='250' height='116' alt='SheerClass'></a>
</div></div>
<div id='search-news'>
<h2>Search this site</h2>
<form method='get' action='search.php'>
<div><input type='text' name='q' value='' id='q' /></div>
<div class='more'><input type='image' name='search' value='' src='".THEME."images/search.jpg'>
<input type='hidden' name='r' value='0' /></div>
</form>
<h3 class='downcast'>Menu</h3>
<div id='news-box'>
<ul>
{SITELINKS}
</ul>
</div>
</div>
<div class='clear'></div>
</div>
<div id='body'>
";
$CUSTOMFOOTER = "
</div>
</div>
<div id='footer'>
<p><a href='page.php?7'>Maine Coon Cats</a> | <a href='page.php?6'>Maine Coon kittens for sale</a> | <a href='contact.php'>Maine Coons Wiltshire</a>
<p>Created by: <a href='http://www.wearepc.co.uk'>MK5 Limited</a> </p>
</div>
";
$CUSTOMPAGES = "comment.php upload.php pm.php?reply page.php forum.php forum_post.php forum_viewforum.php forum_viewtopic.php user.php submitnews.php download.php links.php stats.php usersettings.php signup.php";
$NEWSSTYLE = "
<h2><b>{NEWSTITLE}</b></h2>
<p class='smalltext'>{NEWSDATE=forum}</p>
<p>{NEWSBODY}<br />
{EXTENDED}</p>
<p align='left'>{NEWSCOMMENTS} | {NEWSCATEGORY}</p>
";
define("ICONSTYLE", "float: left; border:0");
define("COMMENTLINK", LAN_THEME_3);
define("COMMENTOFFSTRING", LAN_THEME_2);
define("PRE_EXTENDEDSTRING", "<br /><br />[ ");
define("EXTENDEDSTRING", LAN_THEME_4);
define("POST_EXTENDEDSTRING", " ]<br />");
define("TRACKBACKSTRING", LAN_THEME_5);
define("TRACKBACKBEFORESTRING", " | ");
define('ICONMAIL', 'email_16.png');
define('ICONPRINT', 'print_16.png');
// [linkstyle]
define('PRELINK', "");
define('POSTLINK', "");
define('LINKSTART', "<li><img src='".THEME."images/bullet2.gif'> ");
define('LINKEND', "</li>");
define('LINKDISPLAY', 1);
define('LINKALIGN', "left");
define('LINKCLASS', "");
// [tablestyle]
function tablestyle($caption, $text, $mode=""){
global $style;
if($style == "menu1"){
echo "<div id='search-news'>
<h3 class='downcast'>$caption</h3>
<div id='news-box'>
$text
</div></div>";
}else if($style == "menu2"){
echo "<h1>{$caption} </h1>
</div>
<div class='post-footer'>{$text}
</div>";
}else if($style == ""){
echo "<h2><b>$caption</b></h2>
<br />
<p>$text</p>n";
}
}
$COMMENTSTYLE = "
<div align='center'>
<table class='post-footer' style='width: 75%;'>
<tr>
<td style='width: 30%; vertical-align: top;'>
<p align='left'><span class='mediumtext'>{USERNAME}</span><br /><span class='smalltext'>{TIMEDATE}</span><br />{REPLY}<br /> {IPADDRESS}</td>
<td style='width: 70%; vertical-align: top;'>
<p align='left'><span class='mediumtext'>{COMMENT} {COMMENTEDIT}</span></td>
</tr>
</table>
</div><br />";
$CHATBOXSTYLE = "
<img src='".e_IMAGE."admin_images/chatbox_16.png' alt='' style='vertical-align: middle;' />
<b>{USERNAME}</b>
<div class='smalltext'>
{MESSAGE}
</div>
<br />";
?>
The Style Sheet
Code:
html, body, ul, li {
margin: 0;
padding: 0;
list-style: none;
}
img {
border: 0;
}
a {
font-weight: bold;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
.more {
text-align: right;
}
.left {
float: left;
}
.clear {
clear: both;
}
body, h1, h3, form {
font: 14px tahoma, arial, sans-serif;
margin: 0;
padding: 0;
color: #464545;
}
h2 {
font: 16px tahoma, arial, sans-serif;
margin: 0;
padding: 0;
color: #464545;
}
body {
background: url(images/header_bg.jpg) repeat-x;
text-align: center;
}
#wrapper {
text-align: left;
margin: auto;
width: 774px;
}
#header {
height: 130px;
position: absolute;
}
#header h1 {
margin-top: 0px;
}
#header h1 img {
display: block;
}
#nav {
margin-top: 14px;
}
#nav img {
float: left;
}
#headline {
padding-top: 145px;
}
#photo {
float: left;
width: 255px;
}
#photo div {
border: 0px solid #FF66cc;
padding: 1px;
}
#photo img {
display: block;
}
#photo2 {
float: right;
width: 255px;
}
#photo div {
border: 1px solid #FF66cc;
padding: -5px;
}
#photo img {
display: block
}
#search-news {
float: right;
width: 140px;
}
#search-news div {
padding: 3px 0;
margin: 0;
}
#search-news #q {
width: 140px;
border: 1px solid #2a2a2a;
}
#search-news .downcast {
background: #FF66CC;
border-top: 1px solid #000000;
padding: 3px 4px 4px 4px;
margin: 0px 0 0 0;
}
#search-news h3 {
background: url(images/bullet_letter.gif) no-repeat;
padding-left: 15px;
font-weight: bold;
margin: 1em 0 0.4em 0;
}
#search-news p {
padding-left: 15px;
padding-right: 2px;
margin: 0.1em 0;
}
a {
font-weight: bold;
color: #464545;
}
#body {
padding-top: -15em;
text-align: justify;
}
#body-left {
float: left;
width: 408px;
}
#body-right {
float: right;
width: 281px;
}
#body-left ul.plussbullets {
margin-top: 45px;
margin-left: 120px;
padding: 0;
font-weight: bold;
}
#body-left ul.plussbullets li {
background: top left url(images/bullet_plus.gif) no-repeat;
margin: 0 0 10px 0;
padding: 0 0 0 25px;
}
#body h2, #body p {
margin: 0.3em 0;
}
#body-right p {
margin-right: 2em;
}
#body a.green {
color: #00d2ff;
font-weight: bold;
text-decoration: underline;
}
#footer {
color: #fff;
link: #fff;
background: #FF66cc;
padding: 0px 0 0px 0;
margin-top: 1em;
font-weight: bold;
font-color: #fff;
}
#footer p {
margin: 0;
padding: 0;
}
/* core styles */
.indent{
margin: 15px;
padding: 0 0 0 42px;
background: #FAFAFA url(images/quote.gif) no-repeat 5px 10px !important;
background-position: 8px 10px;
border: 1px solid #f2f2f2;
border-left: 3px solid #EC981F;
font-size: 9px;
}
.smalltext {
font: 10px verdana, tahoma, arial, helvetica, sans-serif;
color:#000;
}
body > .smalltext {
font: 9px verdana, tahoma, arial, helvetica, sans-serif;
color:#fff;
}
.smallblacktext {
font: normal 7pt verdana, tahoma, arial, helvetica, sans-serif;
color:#000;
}
.defaulttext {
font: 11px verdana, tahoma, arial, helvetica, sans-serif;
color:#000;
}
.mediumtext {
font: 11px verdana, tahoma, arial, helvetica, sans-serif;
color:#000;
}
.captiontext {
font: 14px verdana, tahoma, arial, helvetica, sans-serif;
color:#000;
}
.button{
font-size: 11px;
margin: 1px 0 0 0;
color: #494949;
background: white;
border-top: 1px solid #D4D2CF;
border-left: 1px solid #D4D2CF;
border-bottom: 1px solid #868686;
border-right: 1px solid #868686;
}
.tbox{
font-size: 11px;
margin: 1px 0 0 0;
color: #494949;
background: white;
border-top: 1px solid #868686;
border-left: 1px solid #868686;
border-bottom: 1px solid #D4D2CF;
border-right: 1px solid #D4D2CF;
}
.tbox .chatbox{
font-size: 11px;
margin: 1px 0 0 0;
color: #494949;
background: white;
border-top: 1px solid #868686;
border-left: 1px solid #868686;
border-bottom: 1px solid #D4D2CF;
border-right: 1px solid #D4D2CF;
width: 90%;
}
.chatbox{
width:160px;
}
.helpbox {
border: 0px;
background-color: transparent;
color:#000;
font: 9px tahoma, verdana, arial, helvetica, sans-serif;
}
.nextprev{
color: #000;
font: normal 9px verdana, tahoma, arial, helvetica, sans-serif;
text-align:center;
padding : 2px;
}
.np{
color: #000;
font: 9px verdana, tahoma, arial, helvetica, sans-serif;
text-align:center;
padding : 2px;
}
.spacer{
padding: 2px 0px 2px 0px;
}
.border {
border: #000 1px solid;
}
.bodytable {
padding: 0px;
font: 10px verdana, tahoma, arial, helvetica, sans-serif;
color: #000;
}
table {
margin-left: auto;
margin-right: auto;
}
|
