CSS - Template Issues

Hi, just writing to get peoples oppinions.

i have created a template for standardising the way my collegues at work layout their style sheets.

any feedback will be welcome;

PHP Code:
/* ==== General Rules ==== */
    body {
    
    }
    h1 {
    
    }
    h2 {
    
    }
    h3 {
    
    }
    h4 {
    
    }
    h5 {
    
    }
    h6 {
    
    }
    p {
    
    }
    a:link, a:visited {
    
    }
    a:hover {
    
    }
    img {
    
    }
    th {
    
    }
    td {
    
    }
    dt {
    
    }
    li {
    
    }
/* ==== Layout Rules ==== */
    #topBar {
    
    }
    /* ==== Specific Rules ==== */
        #topBar h1 {
        
        }
        #topBar h2 {
        
        }
        #topBar h3 {
        
        }
        #topBar h4 {
        
        }
        #topBar h5 {
        
        }
        #topBar h6 {
        
        }
        #topBar p {
        
        }
        #topBar a:link, #topBar a:visited {
        
        }
        #topBar a:hover {
        
        }
        #topBar img {
        
        }
        #topBar th {
        
        }
        #topBar td {
        
        }
        #topBar dt {
        
        }
        #topBar li {
        
        }
        
    #leftBar {
    
    }
    /* ==== Specific Rules ==== */
        #leftBar h1 {
        
        }
        #leftBar h2 {
        
        }
        #leftBar h3 {
        
        }
        #leftBar h4 {
        
        }
        #leftBar h5 {
        
        }
        #leftBar h6 {
        
        }
        #leftBar p {
        
        }
        #leftBar a:link, #leftBar a:visited {
        
        }
        #leftBar a:hover {
        
        }
        #leftBar img {
        
        }
        #leftBar th {
        
        }
        #leftBar td {
        
        }
        #leftBar dt {
        
        }
        #leftBar li {
        
        }
        
    #rightBar {
    
    }
    /* ==== Specific Rules ==== */
        #rightBar h1 {
        
        }
        #rightBar h2 {
        
        }
        #rightBar h3 {
        
        }
        #rightBar h4 {
        
        }
        #rightBar h5 {
        
        }
        #rightBar h6 {
        
        }
        #rightBar p {
        
        }
        #rightBar a:link, #rightBar a:visited {
        
        }
        #rightBar a:hover {
        
        }
        #rightBar img {
        
        }
        #rightBar th {
        
        }
        #rightBar td {
        
        }
        #rightBar dt {
        
        }
        #rightBar li {
        
        }
        
    #mainContent {
    
    }
    /* ==== Specific Rules ==== */
        #mainContent h1 {
        
        }
        #mainContent h2 {
        
        }
        #mainContent h3 {
        
        }
        #mainContent h4 {
        
        }
        #mainContent h5 {
        
        }
        #mainContent h6 {
        
        }
        #mainContent p {
        
        }
        #mainContent a:link, #mainContent a:visited {
        
        }
        #mainContent a:hover {
        
        }
        #mainContent img {
        
        }
        #mainContent th {
        
        }
        #mainContent td {
        
        }
        #mainContent dt {
        
        }
        #mainContent li {
        
        }
        
    #bottomBar {
    
    }
    /* ==== Specific Rules ==== */
        #bottomBar h1 {
        
        }
        #bottomBar h2 {
        
        }
        #bottomBar h3 {
        
        }
        #bottomBar h4 {
        
        }
        #bottomBar h5 {
        
        }
        #bottomBar h6 {
        
        }
        #bottomBar p {
        
        }
        #bottomBar a:link, #bottomBar a:visited {
        
        }
        #bottomBar a:hover {
        
        }
        #bottomBar img {
        
        }
        #bottomBar th {
        
        }
        #bottomBar td {
        
        }
        #bottomBar dt {
        
        }
        #bottomBar li {
        
        }
        
    #vNav {
    
    }
    /* ==== Specific Rules ==== */
        #vNav h1 {
        
        }
        #vNav h2 {
        
        }
        #vNav h3 {
        
        }
        #vNav h4 {
        
        }
        #vNav h5 {
        
        }
        #vNav h6 {
        
        }
        #vNav p {
        
        }
        #vNav a:link, #vNav a:visited {
        
        }
        #vNav a:hover {
        
        }
        #vNav img {
        
        }
        #vNav th {
        
        }
        #vNav td {
        
        }
        #vNav dt {
        
        }
        #vNav li {
        
        }
        
    #hNav {
    
    }
    /* ==== Specific Rules ==== */
        #hNav h1 {
        
        }
        #hNav h2 {
        
        }
        #hNav h3 {
        
        }
        #hNav h4 {
        
        }
        #hNav h5 {
        
        }
        #hNav h6 {
        
        }
        #hNav p {
        
        }
        #hNav a:link, #hNav a:visited {
        
        }
        #hNav a:hover {
        
        }
        #hNav img {
        
        }
        #hNav th {
        
        }
        #hNav td {
        
        }
        #hNav dt {
        
        }
        #hNav li {
        
        }
        
/* ==== Custom Rules ==== */
    .imgLeft {
         margin: 2px;
         float: left;
    }
    .imgRight {
        margin: 2px;
         float: right;
    } 

Hi,
I am creating a site (www dot 1913atc dot co dot uk) using a downloaded template. I want to increase the hight of the header, but I am having some trouble doing this so it does not affect the other parts of the top menu. Can someone please tell me how to go about increasing the height.

Thanks

Hi,

just to explain I know absolutely nothing about css. I can barely manage to change fonts, so please be gentle with me. I am quite capable of following straight forward instructions though so if you can help it would be much appreciated. I have a website (URL address blocked: PM me to get URL)/joomla that I'm playing with. The submenu's are where I have an issue - they appear exactly as I want when a menu item is selected (indented and normal font weight) however when a sub menu item is selected the indent dissappears and it treats it like a main menu item. Below is the code where I think the issue is.
I've been googling like mad to see if anyone else has the same problem with this particular template but no joy. On a seperate note if there are any joomla template experts out there I would be happy to pay a reasonable fee to make some other modifications (basically the padding and position of the main column is all over the place dependent on the content that is displayed). I'd also like to upgrade this to joomla 1.6 at some stage. Enquired with a couple of "professional" Joomla developers and recieved no reply. I assume my requirements are too small for them to consider, and that they are just too rude to reply to say so.

/*LEFT COL LINK*/
#leftcolumn ul.menu li a, #leftcolumn ul.menu li a:link,
#rightcolumn ul.menu li a, #rightcolumn ul.menu li a:link {
line-height: 18px;
padding: 0 0 0 8px;
text-decoration: none;
font-size: 11px;
background: url(../images/menu_row.jpg) center left no-repeat;
margin: 0;
height: 18px;
color: #666666;
font-weight: bold;
}

#leftcolumn ul.menu li a:hover, #rightcolumn ul.menu li a:hover {
color: #4CAFC6;
text-decoration: none;
}

/*LEFT COL CURRENT LINK*/
#leftcolumn ul.menu li#current a, #leftcolumn ul.menu li#current a:link,
#rightcolumn ul.menu li#current a, #rightcolumn ul.menu li#current a:link {
line-height: 18px;
padding: 0 0 0 8px;
text-decoration: none;
color: #666666;
font-weight: bold;
font-size: 11px;
background: url(../images/menu_row.jpg) center left no-repeat;
margin: 0;
height: 18px;
}

#leftcolumn ul.menu li#current a:hover, #rightcolumn ul.menu li#current a:hover {
color: #4CAFC6;
text-decoration: none;
}

/*LEFT COL SUB LINK*/
#leftcolumn ul.menu li#current ul li a, #leftcolumn ul.menu li#current ul li a:link {
text-decoration: none;
color: #666;
margin: 0 0 0 6px;
font-size: 11px;
background: url(../images/submenu_row.jpg) center left no-repeat;
font-weight: normal;
display: block;
line-height: 18px;
padding: 0 0 0 18px;
border: none;
height: 18px;
}

#leftcolumn ul.menu li ul li#current a, #leftcolumn ul.menu li ul li#current a:link, #leftcolumn ul.menu li ul li#current a:visited, #leftcolumn ul.menu li ul li#current a:hover {
font-size: 11px;
margin: 0 0 0 6px;
padding: 0 0 0 18px;
text-decoration: none;
border: none;
color: #333;
background: url(../images/submenu_row.jpg) center left no-repeat;
height: 18px;
line-height: 18px;
}
/*SUBMENU POSITION*/
#leftcolumn ul.menu li#current ul {
margin: 0;
padding: 0;
}

#leftcolumn ul.menu li#current ul li {
margin: 0;
padding: 0;
}

/*CURRENT SUBMENU POSITION*/
#leftcolumn ul.menu li ul {
margin: 0;
padding: 0;
}

#leftcolumn ul.menu li#current ul li a:hover {
color: #333;
}

#leftcolumn ul.menu li ul, #rightcolumn ul.menu li ul {
list-style: none;
}

I am constructing my very first website using a freeCSS template..Embouteillage.


When I upload it to my webhost (agilityhoster) everything appears to work OK..but the header colour and some of the graphic images don't apear. I've even uploaded the template without making any changes to the original..but the same result. Can anyone help me solve the riddle, Many thanks.

Hi, I'm having a little trouble positioning something on my header. Here's my site: http://ne-yofan.com/test/. I'd like to position the blog in the header to the left without divs. How would I?

Also my header looks different in Firefox and Internet Explorer. How can I fix that?

Please and thank you.

http://www.wam.umd.edu/~gdogum/testing/gdogum/gdogum.html
http://www.wam.umd.edu/~gdogum/testing/gdogum/gdogum.css

those are my two files, it seems to be working okay in IE6/win but not in firefox...

anyone can maybe help me out? thanks it is much apprceiated.



edit: also both files validate

I am using a modified Joomla template for this site - (birminghamfiberguild . org) I need to simply nudge over the menus and the middle content to avoid the couple of pixel overhang going on, on the right. I have looked at it using Firebug and nothing I do seems to do the trick.

I'm doing this site for free for my non-profit org. I'd be appreciative of any help.

Trying to build a CSS Page Centered Template, where content autostretches containers height, as opposed to setting absolute heights. If one column is longer than the others the others should auto stretch to same height.

Also trying to work in a Footer that sits automatically at the bottom. Heres where I am at...as usual different story in every browser.

page
----
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="test.css" rel="stylesheet" type="text/css">
</head>
<body leftmargin="0" topmargin="0"><table><tbody ><tr><td><div class="container">
<!--*******page content start*******-->
<div class="top">top</div>
<div class="main1">main1</div>
<div class="main2">main2</div>
<div class="main3">main3</div>
<!--*******page content end*******-->
</div></td></tr></tbody></table></body></html>

CSS Sheet
----------
table {
width: 100%;
height: 100%;
}
td {
text-align: center;
vertical-align: top;
}
div.container {
position: relative;
margin: 0 auto;
width: 780px;
text-align: left;
height: 100%;
}
div.top {
position: absolute;
top: -3px;
left: 0px;
width: 780px;
height: 203px;
background-color: #CCC;
}
div.main1 {
position: absolute;
top: 200px;
left: 0px;
width: 200px;
height: 100%;
background-color: #BBB;
}
div.main2 {
position: absolute;
top: 200px;
left: 200px;
width: 200px;
height: 100%;
background-color: #DDD;
}
div.main3 {
position: absolute;
top: 200px;
left: 400px;
width: 380px;
height: 100%;
background-color: #AAA;
}

I am trying to design a template and have spent hours trying to figure out where I'm going wrong. I am fairly experienced, but am used to designing with tables and read that it's better to design with DIV tags and assign CSS to position the elements (http://www.csszengarden.com ). The URL to the site I am designing is: http://www.electracustomhomes.com/new.php

Here is the XHTML code:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>{sitename} - {title}</title>
{metadata}
{stylesheet}
</head>
<body>
<div id="page">
	<div id="template_header_top">
		<div id="template_header_01"> </div>
		<div id="template_header_02"> </div>
		<div id="template_header_03"> </div>
	</div>
	<div id="template_header_bottom">
		<div id="template_header_04"> </div>
		<div id="template_header_05"> </div>
		<div id="template_header_06"><div id="search">{search}</div></div>
	</div>		
   <div id="template_left"></div>
   <div id="content">
      <div id="sidebar">
	      <div id="menu">
	         {menu template='simple_navigation.tpl' collapse='1'}
	      </div>	
	      <div id="news">
	         <h2>News</h2>
	          {news number='3' detailpage='news'}
	      </div>
      </div>
      <div id="main">
         <h2>{title}</h2><div id="print">{print showbutton=true script=true}</div>
         {content} <br />
         <div class="left49">
            <p>{cms_selflink dir="previous" label=""}</p>
         </div>
		 <div class="right49">
		 	<p>{cms_selflink dir="next" label=""}</p>
		 </div>
      </div>      
   </div>
  <div id="template_right"></div>
  <div id="template_footer">
	  <div id="template_bottom_left"></div>
	  <div id="template_bottom"></div>
	  <div id="template_bottom_right"></div>
   </div>
</div>
</body>
</html>

And the CSS to accompany it:

Code:

* {
margin:0;
padding:0;
}

body {
   text-align: left;
   font-family: Arial, Helvetica, sans-serif;
   background-color: #620E0C;
   color: #000;
}

img {
   border: 0;
}

a,
a:link 
a:active {
   text-decoration: underline;
   background-color: inherit; 
   color: #620E0C; 
}
a:visited {
   text-decoration: underline;
   background-color: inherit;
  color: #620E0C; 
}

a:hover {
   text-decoration: none;
   background-color: inherit;
   color: #0000FF;
}

div#page {
   border: none;
   margin: 0 auto;
   width: 800px;
   color: #000;
}

div#content {
   clear: both;
   width: 775px;
   height: 100% !important;
   background-color: #ccc;
   color: #000;
   margin: 0px;
   padding: 0px;
}

div#template_left {
   height: 100%;
   width: 12px;
   background: url(uploads/images/template_left.jpg) repeat-y left top;
   float: left;
}

div#template_right {
   height: 100%;
   width: 12px;
   background: url(uploads/images/template_right.jpg) repeat-y right top;
   float: right;
}

div#main {
   width: 200px;
   height: 100%;
   float: right;
}


div#sidebar {
   width: 200px;
   height: 100%;
}

div#menu {
	width: 180px;
	height: 100%;
}

div#menu dfn {
	display: none;
}

div#menu li {
	list-style: none;
}

div#news {
   width: 180px;
   height: 100%;
}

div#template_footer {
   clear: both;
   height: 40px;
   color: #fff;
   background-color: #620E0C;
   margin: 0px;
   padding: 0px;
}

div#template_bottom_left {
   width: 12px;
   height: 40px;
   background: url(uploads/images/template_bottom_left.jpg) no-repeat left bottom;  
}

div#template_bottom {
   width: 775px;
   height: 40px;
   background: url(uploads/images/template_bottom.jpg) no-repeat center bottom;
}


div#template_bottom_right {
   width: 12px;
   height: 40px;
   background: url(uploads/images/template_bottom_right.jpg) no-repeat right bottom;
}

I hope I've given all the information you might require... like I said, I really don't know why it's not working.

Thanks in advance,
Marcus

hello community... i would like to humble ask for anyone's help on this one... i need to add a right column to this template to make it a 3 column joomla template. but since i dont know css, i really dont know what to do. please help me. i have privided the code below.

Here is the index.php


Code:

<?php
/**
 * @copyright	Copyright (C) 2005 - 2008 Open Source Matters. All rights reserved.
 * @license		GNU/GPL, see LICENSE.php
 * Joomla! is free software. This version may have been modified pursuant
 * to the GNU General Public License, and as distributed it includes or
 * is derivative of works licensed under the GNU General Public License or
 * other free or open source software licenses.
 * See COPYRIGHT.php for copyright notices and details.
 */

defined('_JEXEC') or die('Restricted access');



?>
<?php echo '<?xml version="1.0" encoding="utf-8"?'.'>'; ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.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" />
	<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/getirshelp/css/layout.css" type="text/css" />
	<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/getirshelp/css/template.css" type="text/css" />
	<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/getirshelp/css/joomla.css" type="text/css" />
	<!--[if lte IE 6]>
		<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/getirshelp/css/template_ie6.css"  type="text/css" />
	<![endif]-->
    <!-- Flow Player Start -->
<script type="text/javascript" src="flowplayer/flowplayer-3.0.6.min.js"></script> 
<!-- Flow Player End -->
<meta name="verify-v1" content="18/oD5mtAqJSklIsjK/k6NWXMxJ6ZNJMyoGRkIl3Md8=" /> 
</head>

<body id="template-body">
	
<div id="header">
	<div id="top"><jdoc:include type="modules" name="top" /></div>
	<div id="contact"><jdoc:include type="modules" name="user6" /></div>
</div>

<div id="mainnav">
	<div id="blog">
		<a href="irsblog/index.php">Blog</a>
	</div>
	<jdoc:include type="modules" name="user3" />
</div>

<div class="clear"></div>

<div id="mainbody">
	<div id="mainbody2">
		<div id="sidebar">
			<div class="inside">
				<jdoc:include type="modules" name="left" style="xhtml" />
			</div>
		</div>
        
        <div id="sidebar2">
			<div class="inside">
				<jdoc:include type="modules" name="right" style="xhtml" />
		</div>
        

        

		<div id="maincontent">
			<div class="inside">
				
			
				<?php if ($this->getBuffer('message')) : ?>

				<?php endif; ?>
				<jdoc:include type="component" />
			</div>
               
		</div>      
    


		</div>
        
		<div class="clear"></div>

		<div id="mainbottom-wrapper">
			<div id="mainbottom">
				<?php if( $this->countModules('user1') ): ?>
				<div class="mainbottom-box" id="box-1">
					<jdoc:include type="modules" name="user1" style="xhtml" />
				</div>
				<?php endif; ?>
				
				<?php if( $this->countModules('user2') ): ?>
				<div class="mainbottom-box" id="box-2" >
					<jdoc:include type="modules" name="user2" style="xhtml" />
				</div>
				<?php endif; ?>
				
				<?php if( $this->countModules('user4') ): ?>
				<div class="mainbottom-box" id="box-3">
					<jdoc:include type="modules" name="user4" style="xhtml" />
				</div>
				<?php endif; ?>
				
				<?php if( $this->countModules('user5') ): ?>
				<div class="mainbottom-box" id="box-4">
					<jdoc:include type="modules" name="user5" style="xhtml" />
				</div>
				<?php endif; ?>
				
				<div class="clear"></div>
				
			</div>
		</div>
		<div id="footer">
			<jdoc:include type="modules" name="footer" />
		</div>
		

	</div>
</div>

<div id="bottom">
	
	<div class="left">
		<?php echo JText::_("100 S. EDISON AVE., STE. A TAMPA, FL 33606"); ?><br />
		<?php echo JText::_("PHONE: (813) 229-7100 TOLL FREE: (888) 438-6474 FAX: (813) 251-9605"); ?>
	</div>

	<div class="right">
		<?php echo JText::_("&COPY; 2000-2009 Law Offices of  Darrin T. Mish, P.A"); ?>
	</div>
	
	<div class="clear"></div>
</div>
<script src="http://24520.hittail.com/mlt.js"; type="text/javascript"></script> 

</body>
</html>

here is the layout.css

Code:

#header {
	background: transparent url('../images/bg-header.jpg') no-repeat scroll 0 0;
	height: 149px;
	width: 990px;
	margin: 0 auto;
}

#mainnav {
	height: 46px;
	width: 990px;
	margin: 0 auto;
}

#mainbody {
	background: url('../images/bg-mainbody.png') repeat-y scroll 0 0;
	width: 1010px;
	margin: 0 auto;
}

#mainbody2 {
	background: url('../images/bg-mainbody2.png') no-repeat scroll 0 0;
} 


#sidebar {
	background: #FFFFFF url('../images/bg-sidebar.png') repeat-x scroll 0 0;
	color: #000000;
	width: 223px;
	min-height: 700px;
	margin-left: 15px;
	float: left;
}

#sidebar2 {
	background: #FFFFFF url('../images/bg-sidebar.png') repeat-x scroll 0 0;
	color: #000000;
	width: 250px;
	min-height: 700px;
	margin-right: 15px;
	float: right;
}

#maincontent {
	width: 500px;
	float: right;
	margin-right: 15px;
}

#mainbottom-wrapper {
	border-top: 0px dotted #000;
	margin-top: 50px;
	margin: 0 15px;
} 

#mainbottom {
	background: none #EFEFEF no-repeat scroll 0 0;
	min-height: 192px;
	margin: 10px 0;
	padding: 0 10px;
	clear: both;
	color: #000000;
}

#footer {
	background: #0B60B7 url('../images/bg-footer.png') no-repeat scroll 0 0;
	text-align: center;
	color: #FFFFFF;
	padding: 10px 0;
	margin: 0 11px;
}

#bottom {
	background: #FFFFFF url('../images/bg-bottom.png') no-repeat scroll 0 0;
	margin: 10px 0 20px 0;
	width: 1010px;
	margin: 0 auto;
	padding: 10px 0;
}

and here is the template.css
Code:

/* @important */

* { margin:0; padding:0; }

body {
	background: #FFFFFF url('../images/bg.png') repeat-x scroll center top;
	font: 78% Arial,Tahoma,Verdana;
	color: #000000;
}

h1,h2,h3 {
	margin: 0 0 10px 0;
}

h1, .componentheading { font-size: 1.5em; }
h2, .contentheading { font-size: 1.2em; text-align:center; }
h3 { font-size: 1.167em; }

ul {
	margin: 10px 0 10px 0;
	padding: 0 0 0 35px;
}

li{}

a {
	text-decoration: underline;
	color: #666666;
}

p {
	margin: 0 0 15px 0;
	line-height: 20px;
}

img {
	border: none;
}

fieldset {
	border: none;
}

.clear{
	clear: both;
}

.inside {
	padding: 5px;
}

.left {
	float: left;
}

.right {
	float: right;
}

/* Header Style */

#top {
	height: 35px;
	text-align: right;
	color: #FFFFFF;
}

#contact {
	float: right;
	width: 300px;
	min-height: 80px;
	padding-right: 5px;
	color: #000000;
}

/* Mainnav Style*/

#mainnav ul {
	float: right;
	list-style-type: none;
	padding: 0;
	margin: 0 auto;
}

#mainnav ul li {	
	background: url('../images/bg-menu.png') no-repeat scroll right center;
	display: inline;
	float: left;
	height: 46px;
	padding: 0 10px;
}

#mainnav ul li a {
	color: #FFFFFF;
	display: block;
	float: left;
	font-family: times new roman;
	font-size: 1.2em;
	font-weight: bold;
	line-height: normal;
	margin-top: 12px;
	text-decoration: none;
	text-transform: uppercase;
}

/* Blog Button */

#blog {
	float: right;
	margin: 10px 15px 0 120px;
	padding: 0;
	width: 60px;
}

#blog a {
	background: #F2A31E;
	color: #FFFFFF;
	display: block;
	font-family: times new roman;
	font-size: 1.2em;
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
	text-align: center;
	padding: 3px 0;
}


/* Advert Style */

#advert-wrapper {
	border-bottom: 0px dotted #000;
	padding: 0 0 10px 0;
}

.advert-box {
	min-height: 239px;
	width: 367px;
}

/* Sidebar Style */

#sidebar ul {
	list-style-position: inside;
	margin: 0;
	padding: 0;
}

#sidebar ul li {
	
	padding: 5px;
	border-bottom: 1px dotted #B9B9B9;
	list-style-image: url('../images/bullet.png');
}
#sidebar ul li a {
	color: #000000;
	text-decoration: none;
}

#sidebar .moduletable, #sidebar .moduletable_menu{
	margin: 0 0 15px 0;
}

/* Sidebar-c Style */

#sidebar-c ul {
	list-style-position: inside;
	margin: 0;
	padding: 0;
}

#sidebar-c ul li {
	
	padding: 5px;
	border-bottom: 1px dotted #B9B9B9;
	list-style-image: url('../images/bullet.png');
}
#sidebar-c ul li a {
	color: #000000;
	text-decoration: none;
}

#sidebar-c .moduletable, #sidebar .moduletable_menu{
	margin: 0 0 15px 0;
}

/* Main Content Style */

#maincontent img {
	padding: 5px;
}

/* Main Bottom Style */

.mainbottom-box {
	float: left;
	width: 228px;
	min-height: 166px;
	padding: 10px 5px;
	margin: 10px 0;
}

.mainbottom-box ul {
	list-style-image: url('../images/bullet.png');
}

.mainbottom-box ul li {}

.mainbottom-box ul li a {
	text-decoration: none;
	color: #000000;
}

#box-2,#box-3,#box-4 {
	border-left: 1px dotted #B9B9B9;
} 

/*Footer Style */

#footer a {
	color: #FFFFFF;
}

/* Bottom Style */

#bottom .right, #bottom .left {
	font-size: 0.833em;	
}

#bottom .right {
	width: 157px;
}

#bottom .left {
	padding-left: 15px;
}

i would really appreciate it if anyone can help...

thankks a whole lot!!

Boo

Hi I'm building a new site in php & css. Im new to php yet seems fine so far. CSS I have had a little experience with due to my other site (thornapple.co.nz) yet I would still class myself as a eager learner.
You can view the test site as it currently is at -
darkasylum.org/site/template.php

grrr wont let me post the link!

Im just making up the template for the site. Its spilt into a few separate php files-
*Header/Top Nav
*Content
*Right Nav
*Footer

All is going fine yet I have came across a wee stumbling block.
There is a grungy flame bar that runs under the top nav and then again above the footer - framing the content. Im wanting to move these two bars- top one down say 18px and bottom up say 18px so it overlaps/layers over the content box and rightnav.

Can't seem to figure it out after much time trying a few things and a bunch of choice words spoken.... the computer hasn't had flying lessons(yet) but im a little frustrated knowing it's something simple and seeing I have positioned things over the top of others in the past.
Once done the image will be converted to black but this should really matter I guess...

As you can tell by looking at the site im still in the first building stages - getting the template set before we start to move on from there.


Sooo I have been looking around for a forum to ask on that's supportive and helpful. This forum seems a great place with many queries answered.

You can check out my style sheet here - darkasylum.org/site/style.css

Please ANY questions or if you need any part of my code just let me know.
I desperately need to get this project rolling as I'm now way behind and have articles etc coming in.

Help me Obi-Won kenobi your our only hope! (let's put your name there not Obi-Wons!)

How many posts do I need to do before I can post a link? Better go check now...

Thanks so much.

Warmest Wishes
Alex

Looks fine in all other browsers (of course).

http://sports.theedgenews.com

For some strange reason the last half of the blog blows up in IE6 and IE7. It simply does not show up.

Why we don't know. When looking at the source code, it "gets" the whole page, it's just the last half is not rendered.
A copy of the css is here.
http://sports.theedgenews.com/css.css

If anyone has any ideas at all on what to do, it would be greatly appreciated.

Btw this is a design not made by me. I have become pretty familar w/ it for the blog but I have not written it.

Thanks for any help.

I'm a novice web developer and I created a website for a non-profit group using a free CSS Template. It worked great until a few months ago, then the left and right borders suddenly were out of align. It works fine on another web hosting company's web server, but not the one it needs to work on. I recreated the whole website using a different CSS template and it is doing the same thing! Any ideas? Thanks so much!

Hi, there.

I've created a simple tableless 3-column fixed-width layout within a 'wrapper' div#. The column displays exactly how I want it and where I want it in Firefox, Safari, Chrome... but not in IE7 - for some reason, IE7 repeats part of the content of the third column.

courses.algarve-golf.co.uk/problem.htm
courses.algarve-golf.co.uk/scripts/default.css

(The site isn't yet finished, so while the CSS validates, the HTML is not completely validated as I have more content, nav-bars and so on to add.)

I was told that the problem with IE is that I have a comment (necessary for the Dreamweaver Template to function) before the Doctype, which renders the page in 'quirks mode'. Removing that comment made the page display correctly, but the problem is that I need the pages to work on Dreamweaver Templates - so, fixing one problem presents another!

Is there a work-around for the first issue that allows me to maintain the Template markup so that this (and many future pages) can be built on same Template?

Any further help or advice that anyone can offer greatfully appreciated!