Programming Forums
User Name Password Register
 

RSS Feed
FORUM INDEX | TODAY'S POSTS | UNANSWERED THREADS | ADVANCED SEARCH

Reply
 
Thread Tools Display Modes
Old Dec 29th, 2010, 3:59 PM   #1
josh305
Newbie
 
Join Date: Dec 2010
Posts: 10
Rep Power: 0 josh305 is on a distinguished road
Question CSS template problem with Joomla, please help

Hello all, I am working on a Joomla website and installed a extention and seem to not be able to find any help on the Joomla forums, or much help from the Author of the extentions website, the problem is a huge space on the page, you can see what I am talking about here..

http://safesalesintampa.com/tampa_safe_sales/index.php?option=com_djcatalog2&view=items&cid=4:home-safes

I am going to school for programming but have not taken a CSS class yet, only the intro to software development where we did peusdo code..

The author of the extention gave me this advice to fix it "CSS in your template is the issue. I suggest to set "float: left;" for div#content_outleft", I added that to the code then it worked but only on the extention pages, the home page gave me the same space error after that so I switched it back..

here is the template code
@charset "utf-8";
/*Code by Juergen Koller
author url: http//www.lernvid.com
copyright: Lernvid.com - Lernvideos Tutorials Templates PSD-Files und mehr...
*/
#left_border {
	float:left;
	width: 100%;
	text-align: left;
	background-repeat: repeat-y;
	margin: 0 auto;
}  
#right_border {
	float: right;
	background-repeat: repeat-y;
	background-position: right;
}
#bottom {
	float:none;
	background-repeat: repeat-x;
	background-position: bottom;
	width: 1000px;
}
#bottom_right {
	background-repeat: no-repeat;
	background-position: bottom right;
}
#bottom_left {
	background-repeat: no-repeat;
	background-position: bottom left;
}
#header  {
	background: #000;
	height: 37px;
	background-image: url(../images/header_bg_01.jpg);
	line-height: 30px;
	padding: 0 15px 0 15px;
	font-size: 24px;
	color: #d90000;
    text-indent:20px
} 
form {
	margin : 0;
	padding : 0;
	border : none;
}
#date {
	text-align:center;
	font-size: 11px;
	color: #494849;
	margin-right: 20px;
}
#pathway {
	float: left;
	color: #494849;
	font-weight: bold;
	font-size: 11px;
	height: 36px;
	line-height: 36px;
}
#pathway a {
	color: #494849;
	height: 36px;
	line-height: 36px;
}
#search_out {
	float: right;
	background-image: url(../images/search.png);
	background-repeat: no-repeat;
	width: 197px;
	height: 30px;
	margin: 3px 0 0 0;
	padding:0;
}
#search {
	margin: 9px 0 7px 45px;
}
#search input, 
#search .inputbox {
	float: left;
	margin: 0;
	background-color: #fff;
	border: none;
	padding: 0;
}
#banner_out {
	background-repeat: repeat-x;
	height: 275px;
	width: 100%;
}
#banner_in {
	float: left;
	color: #000;
	height: 275px;
	font-size: 10px;
	background-repeat: no-repeat;
	background-position: left;
	width: 100%;
	font-family: Verdana, Arial, sans-serif;
}
#banner {
	float: right;
	padding: 30px 30px 0px 0px;
}
.sitetitle {
	font-size: 30px;
	float: left;
	text-indent: 45px;
	padding-top: 200px;
    font-variant:small-caps;
	color: #494849;
	font-family: Baskerville Old Face, Tahoma, Helvetica, sans-serif;
}
#topmenu_out {
	height: 30px;
	background-repeat: repeat-x;
	border-right:1px solid gray;
	border-left:1px solid gray;
}
#topmenu_left {
	height: 30px;
	background-repeat: no-repeat;
}
#topmenu_right {
	height: 30px;
	background-repeat: no-repeat;
	background-position: right;
}
#topmenu {
	height: 30px;
	line-height: 30px;
	color: #000;
	text-align: left;
	float: left;
	font-variant:small-caps;
	padding-left: 50px;
	overflow:hidden;
}
#topmenu ul, 
#topmenu li {
	display: inline;
	padding: 0px;
	margin: 0px;
	list-style-type: none;
}
#topmenu a {
	color: #494849;
	float: left;
	height: 30px;
	border: none;
	background: none;
	font-size: 12px;
	font-family: Tahoma, Arial,Verdana ;
	padding: 0px 14px;
	line-height: 23px;
	font-weight: bold;
}
#topmenu  a:hover, 
#topmenu #active_menu, 
#topmenu li#current a {
	text-decoration: underline;
	background-image: url(../images/topmenu_over.png);
	color: #a60000;
	background-repeat: repeat-x;
	padding-top:1px;
}
#container {
	padding-bottom: 10px;
}
#maincontent {
	padding:0;
	margin: 3px 33px 10px 33px;
}
#left_out {
	width: 180px;
	float: left;
	padding: 0;
	margin: 0;
	background-color: #b3b3b3;
	overflow:hidden;
}
#right_out  {
	width: 180px;
	float: right;
	padding: 0;
	margin: 0;
	background-color: #d7d7d7;
	overflow:hidden;
}
#left_out ul, #left_out li, #right_out ul, #right_out li {
	list-style-type: none;
	padding: 0;
	margin: 0;
}
#left_out ul.menu li a, 
#left_out ul.menu li#current a, 
#left_out a.mainlevel,
#right_out ul.menu li a, 
#right_out ul.menu li#current a, 
#right_out a.mainlevel {
	display: block;
	height: 25px;
	line-height: 25px;
	background-repeat: no-repeat;
	background-position: left;
	width: 172px;
	font-size: 12px;
	font-weight: normal;
	text-indent: 20px;
	overflow:hidden;
}
#left_out ul.menu a:hover, 
#right_out ul.menu a:hover,
#left_out a.mainlevel:hover, 
#right_out a.mainlevel:hover, 
#left_out #active_menu, 
#right_out #active_menu,
#left_out ul.menu li#current a,
#right_out ul.menu li#current a {
	background-image: url(../images/mainlevel_over.png);
	text-decoration: none;
	background-repeat: no-repeat;
	background-position: left;
	color: #000;
}
#left_out a.sublevel, 
#left_out ul.menu li#current li a,
#left_out ul.menu li li a,
#left_out ul.menu li li#current a,
#left_out ul.menu li li#current li a,
#left_out ul.menu li li li a,
#right_out a.sublevel, 
#right_out ul.menu li#current li a,
#right_out ul.menu li li a,
#right_out ul.menu li li#current a,
#right_out ul.menu li li#current li a,
#right_out ul.menu li li li a {
	background-repeat: no-repeat;
	height: 20px;
	line-height: 20px;
	background-position: left;
	text-indent: 20px;
	border: none;
	display: block;
}
#left_out a.sublevel#active_menu,
#right_out a.sublevel#active_menu,
#left_out a.sublevel:hover,
#right_out a.sublevel:hover,
#left_out ul.menu li#current li a,
#left_out ul.menu li li#current a,
#left_out ul.menu li li#current li a,
#right_out ul.menu li#current li a,
#right_out ul.menu li li#current a,
#right_out ul.menu li li#current li a,
#left_out ul.menu li#current a:hover,
#right_out ul.menu li#current a:hover,
#left_out ul.menu li li a:hover,
#right_out ul.menu li li a:hover{
	text-decoration: none;
	background-repeat: no-repeat;
	background-position: left;
	color: #ffffff;
}
#left_out .module, 
#right_out .module, 
#left_out .moduletable, 
#right_out .moduletable,
#left_out .module_menu, 
#right_out .module_menu, 
#left_out .module_text,
#right_out .module_text {
	background-repeat: repeat-y;
	margin: 0;
	padding: 0;
}
#left_out .module_text,
#right_out .module_text,
#left_out a,
#right_out a  {
	background-repeat: repeat-y;
	margin: 0;
	padding: 0 3px 0 3px;
}
#left_out .module div, 
#right_out .module div, 
#left_out .moduletable div, 
#right_out .moduletable div,
#left_out .module_menu div, 
#right_out .module_menu div,
#left_out .module_text div,
#right_out .module_text div {
	background-position: bottom;
	background-repeat: no-repeat;
	width: 180px
}
#left_out .module div div, 
#right_out .module div div, 
#left_out .moduletable div div, 
#right_out .moduletable div div,
#left_out .module_menu div div, 
#right_out .module_menu div div,
#left_out .module_text div div,
#right_out .module_text div div {
	background-position: top;
	background-repeat: no-repeat;
}
#left_out .module div div div, 
#right_out .module div div div, 
#left_out .moduletable div div div, 
#right_out .moduletable div div div,
#left_out .module_menu div div div, 
#right_out .module_menu div div div,
#left_out .module_text div div div,
#right_out .module_text div div div{
	background: none;
	padding: 5px 5px 10px 5px;
	overflow: hidden;
	width: 165px;
}
#left_out .module div div div div, 
#right_out .module div div div div, 
#left_out .moduletable div div div div, 
#right_out .moduletable div div div div,
#left_out .module_menu div div div div, 
#right_out .module_menu div div div div,
#left_out .module_text div div div div,
#right_out .module_text div div div div {
	padding: 0;
}
#left_out h3, 
#right_out h3 {
	height: 35px;
	width: 172px;
	background-repeat: no-repeat;
	color: #222;
	line-height: 35px;
	text-indent: 20px;
	font-variant:small-caps;
	padding: 0;
	margin: 3px 0 0 0;
	font-size: 14px;
	font-weight: bold;
	border:1px solid #666;
}
#content_outleft,
#content_outmiddle, 
#content_outright {
	margin: 0 0 10px 0;
}
#content_outleft {
	margin: 0 0 0 188px;
}
#content_outmiddle {
	margin: 0 188px;
}
#content_outright {
	margin: 0 188px 0 0;
}
#top {
	background-image: url(../images/chrome/user_top_bg.jpg);
	border:1px solid gray;
	padding: 0 10px 10px 10px;
}
#top h3 {
	border-top:1px solid #666;
	border-bottom:1px solid #666;
	background-color: #ddd;
	text-indent: 10px;
}

#content {
	background-repeat: repeat-x;
	background-position: bottom;
	width: auto;
	min-height: 500px;
	margin-top: 10px;
	border-top: 2px solid #666;
}
#content_border_left {
	background-repeat: repeat-y;
	background-position: top left;
}
#content_border_right {
	background-repeat: repeat-y;
	background-position: top right;

}
#content_bottom_right {
	background-repeat: no-repeat;
	background-position: bottom right;
	min-height: 500px;
	padding-bottom:50px;
}
#content_bottom_left {
	background-repeat: no-repeat;
	background-position: bottom left;
	padding: 3px 5px 55px 5px;
}
ul.pagination {
	width: 500px;
}
#blank {
	width: 100%;
	height: 50px;
	background-color: transparent;
}
br.clr{
	clear:none;
}
.pagenav {
	border : 1px solid #666;
	padding : 3px 5px 2px 5px;
	margin : 5px 1px 5px 1px;
	background-image : url(../images/button.jpg);
}
.pagenav:hover {
	border : 1px solid #444444;
	background-image : url(../images/button_hover.jpg);
}
.blog {
	width : 100%;
}
.blog_more {
	margin : 10px 5px 20px 5px;
}
.blog_more strong {
	margin : 2px;
	display : block;
	font-size : 14px;
	font-weight : bold;
}
.article_separator {
	clear : both;
	display : block;
	height : 10px;
	margin-bottom : 10px;
	border-bottom : 1px solid #888888;
}
.user_bg, 
.user_left, 
.user_right {
	height: 148px;
}
.user_bg {
	margin: 0 0 10px 0;
	padding: 0;
	background-repeat: repeat-x;
	width: 100%;
}
.user_left {
	background-repeat: no-repeat;
	background-position: left top;
}
.user_right {
	background-repeat: no-repeat;
	background-position: right top;
}
.user_bg .topmodule_usertwo {
	width: 45%;
	height: 140px;
	margin: 0px;
	float: left;
	padding: 0px;
}
.user_bg .topmodule_userone {
	width: 100%;
	height: 140px;
	margin: 0px;
	float: left;
	padding: 0px;
}
.user_bg ul, 
.user_bg li,
.user_bg li:hover,
.user_bg ul:hover {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	background-image:none;
}
.module ul,
.module li, 
.module ul:hover ,
.module li:hover {
	list-style-type: none;
	background: none;
}
.user_bg th, 
.user_bg h3 {
	height: 28px;
	line-height: 30px;
	font-size: 14px;
	color:  maroon;
	padding: 0px 0px;
	font-family:  Arial, Helvetica, Sans-Serif;
	margin: 0 0 5px 0;
	font-weight: bolder;
	font-variant:small-caps;
	border-bottom: 1px solid silver;
}
.user_bg .user_inside {
	margin: 5px 5px 5px 20px;
	height: 136px;
	overflow: hidden;
	padding: 0px 5px;
	font-size: 11px;
}
.user_bg .user_inside1 {
	margin: 5px 5px 5px 30px;
	height: 136px;
	overflow: hidden;
	padding: 0px 5px;
	font-size: 11px;
}
.separator {
	width: 2%;
	min-width: 22px;
	height: 140px;
	float: left;
	background-repeat: no-repeat;
	background-position: top center;
}
#user_bottom {
	padding: 0px 16px;
	margin: 35px;
}
#user_bottom .user_bg {
	margin: 0;
}
.user_bg .bottom_user, .user_bg .bottom_user1, .user_bg .bottom_user2, .user_bg .bottom_user3 {
	width: 30%;
	height: 140px;
	margin: 0px;
	float: left;
	padding: 0px;
}
.user_bg .bottom_user1 {
	width: 100%;
}
.user_bg .bottom_user2 {
	width: 45%;
}
.user_bg .bottom_user3 {
	width: 30%;
}
.user_bg .bottom_user1 {
	width: 30%;
	height: 140px;
	margin: 0px;
	float: left;
	padding: 0 0 0 15px;
}
#footer {
	background-color: transparent;
	background-image: url(../images/footer.jpg);
	background-repeat: no-repeat;
	color: #494849;
	text-align: center;
	padding: 10px 0px 0px 0px;
	font-family: Tahoma, Arial, Verdana;
	height: 190px;
}

#copy {
	font-size: 11px;
	font-variant:small-caps;
	padding-left: 10px;
}
#othermenu {
	overflow: hidden;
	font-size: 10px;
}

#othermenu_in ul, 
#othermenu_in li {
	list-style-type: none;
	margin: 0;
	padding: 0;
	display: inline;
}
#othermenu_in {
	margin-right: -2px;
}
#othermenu_in a {
	color: #494849;
	border-right: 1px solid #8B8B8B;
	padding: 0px 20px;
}
.clr {
	clear:both;
}
body  {
	font: 12px Tahoma, Verdana, Arial, Helvetica, sans-serif;
	background: #a19e9e;
	background-image: url(../images/bg_01.jpg);
	background-position: center top;
	background-repeat:repeat-y;
	margin: auto;
	padding: 0;
	text-align: center;
	color: #000;
    width: 1000px;
}
p, td, tr {
	font-size: 11px;
	padding: 0;
	margin: 20px 10px;
	font-family: Tahoma, Arial, Verdana;
}
ul {
	margin: 0px;
	padding: 0px 0px 0px 18px;
	list-style-type: square;
} 
a:link, a:visited {
	color: #a60000;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}

.button {
	color : #101010;
	background-color : #ddd;
	text-align : center;
	font-size : 10px;
	border : 1px solid #2c2c2c;
	padding : 2px 3px 2px 3px;
	margin : 2px 3px 2px 3px;
	background-image : url(../images/button.jpg);
}
.button:hover {
	background-image : url(../images/button_hover.jpg);
	border : 1px solid #444;
	color: #ff0000;
}

.inputbox, input {
	border: 1px solid #cccccc;
}
.input, img {
	border: none;
}
.search {}
a.readon {
	background-image: url(../images/readon.gif);
	background-repeat: no-repeat;
	height: 20px;
	width: 102px;
	color: #a60000;
	float: left;
	text-indent: 18px;
	line-height: 15px;
	margin: 10px 0 0 0;
	padding:2px;
	font-size: 11px;
}
.back_button {
	background-image: url(../images/backbutton.gif);
	height: 20px;
	line-height: 15px;
	width: 102px;
	text-indent: 18px;
	color: #a60000;
	font-size: 11px;
	margin-top: 5px;
}
.back_button a:link {
	color: #000;
}
.componentheading {
	background-image: url(../images/componentheading.jpg);
	height: 29px;
	line-height: 25px;
	padding: 0px 10px;
	color: #101010;
	font-weight: bold;
	font-variant:small-caps;
	font-size: 12px;
	font-family: Arial, Helvetica, Sans-Serif;
}
.contentheading, .contentheading a {
	font-size: 14px;
	font-family: Tahoma, Arial, Helvetica, Sans-Serif;
	font-variant:small-caps;
	color: #101010;
	text-decoration:underline;
	text-indent: 10px;
	
} 
.contentdescription {
	padding: 10px;
} 
.sectiontableheader {
	padding: 3px 5px;
	background-color: #c5c5c5;
	color: #760000;
	font-size: 15px;
	border:1px solid #000;
}
.sectiontableentry0 {
	border-bottom : 1px solid #666;
	background-color : #fff;
	text-align : left;
}
.sectiontableentry1 {
	border-bottom : 1px solid #666;
	background-color : #e6e6e6;
	text-align : left;
}
.sectiontableentry2 {
	border-bottom : 1px solid #666;
	background-color : #fff;
	text-align : left;
}
.sectiontableentry1 td {
	padding : 2px 5px 2px 5px;
	margin : 1px;
}
.sectiontableentry2 td {
	padding : 2px 5px 2px 5px;
	margin : 1px;
}
.sectiontableentry0 td {
	padding : 2px 5px 2px 5px;
	margin : 1px;
}
table.poll {
	padding : 0;
	width : 80%;
	border-collapse : collapse;
}
table.poll td {
	padding :0 0 0 3px;
}

.createdate, 
.small {
	font-size: 10px;
	color: #494849;
	text-indent: 10px;
}
li {
	text-align : left;
	line-height : 14px;
	padding-left : 18px;
	background-image : url(../images/list.png);
	background-repeat : no-repeat;
	background-position : 0 2px;
	list-style-type : none;
}
li:hover {
	text-align : left;
	line-height : 14px;
	padding-left : 18px;
	background-position : 0 2px;
	background-image : url(../images/list_hover.png);
	background-repeat : no-repeat;
}

then there is another template (template.css and chrome.css)

@charset "utf-8";
/*Code by Juergen Koller
author url: http//www.lernvid.com
copyright: Lernvid.com - Lernvideos Tutorials Templates PSD-Files und mehr...
*/
#left_out a.sublevel, 
#left_out ul.menu li#current li a,
#left_out ul.menu li li a,
#left_out ul.menu li li#current li a,
#left_out ul.menu li li li a,
#right_out a.sublevel, 
#right_out ul.menu li#current li a,
#right_out ul.menu li li a,
#right_out ul.menu li li#current li a,
#right_out ul.menu li li li a {
	color: #494849;
}
#left_out a.sublevel, 
#left_out ul.menu li#current li a,
#left_out ul.menu li li a,
#left_out ul.menu li li#current a, 
#left_out ul.menu li li#current li a,
#left_out ul.menu li li li a,
#right_out a.sublevel, 
#right_out ul.menu li#current li a,
#right_out ul.menu li li a,
#right_out ul.menu li li#current a, 
#right_out ul.menu li li#current li a,
#right_out ul.menu li li li a,
#left_out ul.menu li li a:hover,
#right_out ul.menu li li a:hover {
	background-image: url(../images/chrome/sublevel.gif);
}
#left_out ul.menu li a, 
#left_out ul.menu li#current a, 
#left_out a.mainlevel,
#right_out ul.menu li a, 
#right_out ul.menu li#current a, 
#right_out a.mainlevel {
	border-bottom: 1px solid #494849;
}
#left_out ul.menu li a,
#left_out a.mainlevel,
#right_out ul.menu li a,  
#right_out a.mainlevel {
	color: #000;
	background-image: url(../images/chrome/mainlevel_bg.png);
}
#left_border {
	background-image: url(../images/chrome/left_border.jpg);
}  
#right_border {
	background-image: url(../images/chrome/right_border.jpg);
}
#bottom {
	background-image: url(../images/chrome/bottom.gif);
}
#bottom_right {
	background-image: url(../images/chrome/bottom_right.jpg);
}
#bottom_left {
	background-image: url(../images/chrome/bottom_left.jpg);
}
#banner_out {
	background-image: url(../images/chrome/banner2.jpg);
}
#banner_in {
	background-image: url(../images/chrome/banner.gif);
}
#topmenu_out {
	background-image: url(../images/chrome/topmenu_bg.jpg);
}
#topmenu_left {
	background-image: url(../images/chrome/topmenu_left.jpg);
}
#topmenu_right {
	background-image: url(../images/chrome/topmenu_right.jpg);
}
#left_out a.sublevel#active_menu, #right_out #active_menu {
	background-image: url(../images/chrome/sublevel.gif);
}
#left_out .module, 
#right_out .module, 
#left_out .moduletable, 
#right_out .moduletable,
#left_out .module_menu, 
#right_out .module_menu, 
#left_out .module_text,
#right_out .module_text {
	background-image: url(../images/chrome/moduletable_bg.png);
}
#left_out .module div, 
#right_out .module div, 
#left_out .moduletable div, 
#right_out .moduletable div,
#left_out .module_menu div, 
#right_out .module_menu div,
#left_out .module_text div,
#right_out .module_text div {
	margin-bottom: 5px;
	background-image: url(../images/chrome/moduletable_bottom.png);
}
#left_out .module div div, 
#right_out .module div div, 
#left_out .moduletable div div, 
#right_out .moduletable div div,
#left_out .module_menu div div, 
#right_out .module_menu div div,
#left_out .module_text div div,
#right_out .module_text div div {
	background-image: url(../images/chrome/moduletable_top.png);
}
#left_out h3, 
#right_out h3 {
	background-image: url(../images/chrome/moduletable_h3.png);
}
#content {
	background-image: url(../images/chrome/content_bottom_bg.jpg);
}
#content_border_left {
	background-image: url(../images/chrome/border.gif);
}
#content_border_right {
	background-image: url(../images/chrome/border.gif);
}
#content_bottom_right {
	background-image: url(../images/chrome/content_bottom_right.jpg);
}
.user_bg {
	background-image: url(../images/chrome/user_top_bg.jpg);
}
.user_left {
	background-image: url(../images/chrome/user_top_left.jpg);
}
.user_right {
	background-image: url(../images/chrome/user_top_right.jpg);
}
.separator {
	background-image: url(../images/chrome/separator.jpg);
}

Please help!!! I will forever be in your debt lol Thanks!!

btw; I dont know if it makes a difference but I tried the purity template and had no issues with the template, so the space error only does this on certain templates.
josh305 is offline   Reply With Quote
Reply

Bookmarks

« Previous Thread in Forum | Next Thread in Forum »

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
CSS Error - Template Breaks FF & IE JetWash HTML / XHTML / CSS 5 May 19th, 2009 1:53 AM
problem in css desperateboy HTML / XHTML / CSS 2 Oct 27th, 2007 7:29 AM
template specialization problem l2u C++ 6 Aug 17th, 2007 2:27 AM
Template + operator problem Polyphemus_ C++ 3 Sep 30th, 2005 7:43 PM




DaniWeb IT Discussion Community
All times are GMT -5. The time now is 12:52 PM.

Powered by vBulletin® Version 3.7.0, Copyright ©2000 - 2017, Jelsoft Enterprises Ltd.
Copyright ©2007 DaniWeb® LLC