Home arrow Forum SMF template get totally messed up - Please help
  Welcome, Guest. Please login or register.
Did you miss your activation email?
January 08, 2009, 03:06:05 AM
Home New Posts Search Calendar


Login with username, password and session length
+  Joomla Forum
|-+  Joomla Hacks
| |-+  Joomla-SMF Forum Support
| | |-+  Joomla-SMF 1.1.x (Moderators: -Wolverine, kai920)
| | | |-+  SMF template get totally messed up - Please help
0 Members and 1 Guest are viewing this topic. « previous next »
Pages: [1] Go Down Print
Author Topic: SMF template get totally messed up - Please help  (Read 1563 times)
vn4m
Joomla Newbie
*

Karma: +0/-0
Offline Offline

Posts: 3


View Profile
SMF template get totally messed up - Please help
« on: July 20, 2006, 03:02:08 PM »

Please, please help me out. Thank you.

I have problem with link to the forum:

Please see this link:

http://www.tuvanxinviec.com/component/option,com_smf/Itemid,37/

And:

http://www.tuvanxinviec.com/forum/

The first one is the component link to the SMF forum and the second one is the direct link. You can see that the direct link work just fine but the component is totally a mess. Any help is welcome.... anything at all. Thanks again.
Logged
-Wolverine
Moderator
Joomla Guru
*****

Karma: +376/-34
Offline Offline

Posts: 3393


Lead Developer


View Profile WWW
Re: SMF template get totally messed up - Please help
« Reply #1 on: July 20, 2006, 10:07:13 PM »

you probably have duplicate entries in you SMF template css file and your Joomla template css file.  You need to merge those entries.
Logged

Need help?  Check Here First!
Get the JSMF User Guide
SEARCH this forum.
vn4m
Joomla Newbie
*

Karma: +0/-0
Offline Offline

Posts: 3


View Profile
Re: SMF template get totally messed up - Please help
« Reply #2 on: July 21, 2006, 10:13:07 AM »

Thank you for the advice. But I don't know what entries to merge. Below is the codes for each css. Could you take a look?

Joomla css:

Code:
/* CSS Document */

html {
height: 100%;
}

body {
height: 100%;
margin-bottom: 1px;
}

.clr {
clear: both;
}

.outline {
  border: 1px solid #cccccc;
  background: #ffffff;
padding: 2px;
}

#buttons_outer {
width: 635px;
  margin-bottom: 2px;
margin-right: 2px;
float: left;

}

#buttons_inner {
border: 1px solid #cccccc;
height: 21px !important;
height: 23px;
}

#pathway_text {
  overflow: hidden;
display: block;
height: 25px;
line-height: 25px !important;
line-height: 22px;
padding-left: 4px;
border: 1px solid #ccc;
margin-bottom: 2px;
}

#pathway_text img {
margin-left: 5px;
margin-right: 5px;
margin-top: 6px;
}

#buttons {
float: left;
margin: 0px;
padding: 0px;
width: auto;
}


ul#mainlevel-nav
{
list-style: none;
padding: 0;
margin: 0;
font-size: 0.8em;
}

ul#mainlevel-nav li
{
background-image: none;
padding-left: 0px;
padding-right: 0px;
float: left;
margin: 0;
font-size: 11px;
line-height: 21px;
white-space: nowrap;
border-right: 1px solid #cccccc;
}

ul#mainlevel-nav li a
{
display: block;
padding-left: 15px;
padding-right: 15px;
text-decoration: none;
color: #333333;
background: transparent;
}

#buttons>ul#mainlevel-nav li a { width: auto; }

ul#mainlevel-nav li a:hover
{
color: #fff;
background: #c64934;
}


#search_outer {
float: left;
width: 165px;
}

#search_inner {
  border: 1px solid #cccccc;
padding: 0px;
  height: 21px !important;
  height: 23px;
  overflow: hidden;
}

#search_inner form {
  padding: 0;
  margin: 0;
}

#search_inner .inputbox {
border: 0px;
padding: 3px 3px 3px 5px;
font-family: arial, helvetica, sans-serif;
font-size: 11px;
color: #c64934;
}

#header_outer {
text-align: left;
border: 0px;
margin: 0px;
}

#header {
float: left;
padding: 0px;
margin-right: 2px;
width: 635px;
height: 150px;
background: url(../images/header_short.jpg) no-repeat;
}

#top_outer{
float: left;
width: 165px;
}

#top_inner {
  border: 1px solid #cccccc;
padding: 2px;
  height: 144px !important;
  height: 150px;
  overflow: hidden;
  float: none !important;
  float: left;
}

#left_outer {
  float: left;
margin-top: 2px;
width: 165px;
}

#left_inner {
  border: 1px solid #cccccc;
padding: 2px;
  float: none !important;
  float: left;
}

#content_outer {
padding: 0px;
margin-top: 0px;
margin-left: 2px;
/** border: 1px solid #cccccc; **/
float: left;
width: 635px;
}

#content_inner{
  float: none !important;
  float: left;
  padding: 0;
  padding-top: 2px;
  margin: 0;
}

table.content_table {
  width: 100%;
padding: 0px;
margin: 0px;
}

table.content_table td {
padding: 0px;
margin: 0px;
}


#banner_inner {
float: left;
padding: 0px;
height: 70px;
}

#poweredby_inner {
float: right;
padding: 0px;
margin-left: 0px;
height: 70px;
}

#right_outer {
margin-left: 2px;
width: 165px;
}

#right_inner {
  float: none !important;
  float: left;
  border: 1px solid #cccccc;
  padding: 2px;
}


.user1_inner {
border: 1px solid #cccccc;
  float: none !important;
  float: left;
margin: 0px;
padding: 2px;
}

.user2_inner {
border: 1px solid #cccccc;
  float: none !important;
  float: left;
margin: 0px;
padding: 2px;
}

table td.body_outer {
padding: 2px;
border: 1px solid #cccccc;
}

.maintitle {
color: #ffffff;
font-size: 40px;
padding-left: 15px;
padding-top: 20px;
}

.error {
  font-style: italic;
  text-transform: uppercase;
  padding: 5px;
  color: #cccccc;
  font-size: 14px;
  font-weight: bold;
}

/** old stuff **/

.back_button {
float: left;
  text-align: center;
  font-size: 11px;
  font-weight: bold;
  border: 3px double #cccccc;
  width: auto;
  background: url(../images/button_bg.png) repeat-x;
  padding: 0px 10px;
  line-height: 20px;
  margin: 1px;
}

.pagenav {
  text-align: center;
  font-size: 11px;
  font-weight: bold;
  border: 3px double #cccccc;
  width: auto;
  background: url(../images/button_bg.png) repeat-x;
  padding: 0px 10px;
  line-height: 20px;
  margin: 1px;
}

.pagenavbar {
margin-right: 10px;
float: right;
}

#footer {
text-align: center;
padding: 3px;
}

ul
{
margin: 0;
padding: 0;
list-style: none;
}

li
{
line-height: 15px;
padding-left: 15px;
padding-top: 0px;
background-image: url(../images/arrow.png);
background-repeat: no-repeat;
background-position: 0px 2px;
}


td {
text-align: left;
font-size: 11px;
}



body {
margin: 15px;
height: 100%;
padding: 0px;
font-family: Arial, Helvetica, Sans Serif;
line-height: 120%;
font-size: 11px;
color: #333333;
background: #ffffff;
}

/* Joomla core stuff */
a:link, a:visited {
color: #c64934; text-decoration: none;
font-weight: bold;
}

a:hover {
color: #900; text-decoration: none;
font-weight: bold;
}

table.contentpaneopen {
  width: 100%;
padding: 0px;
border-collapse: collapse;
border-spacing: 0px;
margin: 0px;
}

table.contentpaneopen td {
   padding-right: 5px;
}

table.contentpaneopen td.componentheading {
padding-left: 4px;
}



table.contentpane {
  width: 100%;
padding: 0px;
border-collapse: collapse;
border-spacing: 0px;
margin: 0px;
}

table.contentpane td {
margin: 0px;
padding: 0px;
}

table.contentpane td.componentheading {
padding-left: 4px;
}

table.contentpaneopen fieldset {
border: 0px;
border-bottom: 1px solid #eee;
}

.button {
  color: #c64934;
  font-family: Arial, Hevlvetica, sans-serif;
  text-align: center;
  font-size: 11px;
  font-weight: bold;
  border: 3px double #cccccc;
  width: auto;
  background: url(../images/button_bg.png) repeat-x;
  padding: 0px 5px;
  line-height: 18px !important;
  line-height: 16px;
  height: 26px !important;
  height: 24px;
  margin: 1px;
}

.inputbox {
padding: 2px;
border:solid 1px #cccccc;
background-color: #ffffff;
}

.componentheading {
background: url(../images/subhead_bg.png) repeat-x;
color: #666666;
text-align: left;
padding-top: 4px;
padding-left: 4px;
height: 21px;
font-weight: bold;
font-size: 10px;
text-transform: uppercase;

}

.contentcolumn {
padding-right: 5px;
}

.contentheading {
height: 30px;

color: #c64934;
font-weight: bold;
font-size: 14px;
white-space: nowrap;
}



.contentpagetitle {
font-size: 13px;
font-weight: bold;
color: #cccccc;
text-align:left;
}

table.searchinto {
width: 100%;
}

table.searchintro td {
font-weight: bold;
}

table.moduletable {
width: 100%;
margin-bottom: 5px;
padding: 0px;
border-spacing: 0px;
border-collapse: collapse;
}

div.moduletable {
padding: 0;
margin-bottom: 2px;
}

table.moduletable th, div.moduletable h3 {
background: url(../images/subhead_bg.png) repeat-x;
color: #666666;
text-align: left;
padding-left: 4px;
height: 21px;
line-height: 21px;
font-weight: bold;
font-size: 10px;
text-transform: uppercase;
margin: 0 0 2px 0;
}

table.moduletable td {
font-size: 11px;
padding: 0px;
margin: 0px;
font-weight: normal;
}

table.pollstableborder td {
  padding: 2px;
}

.sectiontableheader {
  font-weight: bold;
  background: #f0f0f0;
  padding: 4px;
}

.sectiontablefooter {

}

.sectiontableentry1 {
background-color : #ffffff;
}

.sectiontableentry2 {
background-color : #f9f9f9;
}

.small {
color: #999999;
font-size: 11px;
}

.createdate {
height: 15px;
padding-bottom: 10px;
color: #999999;
font-size: 11px;
}

.modifydate {
height: 15px;
padding-top: 10px;
color: #999999;
font-size: 11px;
}

table.contenttoc {
  border: 1px solid #cccccc;
  padding: 2px;
  margin-left: 2px;
  margin-bottom: 2px;
}

table.contenttoc td {
  padding: 2px;
}

table.contenttoc th {
  background: url(../images/subhead_bg.png) repeat-x;
  color: #666666;
text-align: left;
padding-top: 2px;
padding-left: 4px;
height: 21px;
font-weight: bold;
font-size: 10px;
text-transform: uppercase;
}

a.mainlevel:link, a.mainlevel:visited {
display: block;
background: url(../images/menu_bg.png) no-repeat;
vertical-align: middle;
font-size: 11px;
font-weight: bold;
color: #ccc;
text-align: left;
padding-top: 5px;
padding-left: 18px;
height: 20px !important;
height: 25px;
width: 100%;
text-decoration: none;
}

a.mainlevel:hover {
background-position: 0px -25px;
text-decoration: none;
color: #fff;
}

a.mainlevel#active_menu {
color:#fff;
font-weight: bold;
}

a.mainlevel#active_menu:hover {
color: #fff;
}

a.sublevel:link, a.sublevel:visited {
padding-left: 1px;
vertical-align: middle;
font-size: 11px;
font-weight: bold;
color: #c64934;
text-align: left;
}

a.sublevel:hover {
color: #900;
text-decoration: none;
}

a.sublevel#active_menu {
color: #333;
}

.highlight {
background-color: Yellow;
color: Blue;
padding: 0;
}
.code {
background-color: #ddd;
border: 1px solid #bbb;
}

form {
/* removes space below form elements */
margin: 0;
  padding: 0;
}

div.mosimage {
  border: 1px solid #ccc;
}

.mosimage {
  border: 1px solid #cccccc;
  margin: 5px
}

.mosimage_caption {
  margin-top: 2px;
  background: #efefef;
  padding: 1px 2px;
  color: #666;
  font-size: 10px;
  border-top: 1px solid #cccccc;
}

span.article_seperator {
display: block;
height: 1.5em;
}

Forum css

Code:
/* Dilber Theme*/
.maindiv
{
border-left: 1px solid #6699CC;
border-right: 1px solid #6699CC;
border-bottom: 2px solid #6699CC;
background: #FAFCFF;
}

.topbar
{
background: #6699CC url(images/lightblue/topbar.gif) repeat-x;
}
.mainpage
{
background: #FAFCFF url(images/lightblue/mainpage.gif) repeat-x;
}


.topbar2
{
background: #99CCFF url(images/lightblue/topbar2.gif) repeat-x;
}
.menubar
{
background: #6699CC url(images/lightblue/menubar.gif) repeat-x;
color: #FFFFFF;
}
.menubg , tr.menubg td
{
background: #6699CC url(images/lightblue/menubar.gif) repeat-x;
color: #FFFFFF;
}

.menubg2 , tr.menubg2 td
{
background: #336699 url(images/lightblue/menubarSelected.gif) repeat-x;
color: #FFFFFF;
}
.menubg a:link, .menubg a:visited , .menubg2 a:link, .menubg2 a:visited
{
color: #FFFFFF;
}
.menubg a:hover, .menubg2 a:hover
{
color: #E0E0FF;
}

.memberbardiv
{
background: transparent url(images/lightblue/memberbar.gif) repeat-x;
}
.memberbardivbottom
{
background: transparent url(images/lightblue/memberbar2.gif) repeat-x;
}

.memberbar, tr.memberbar td
{
}
.memberbar a:link, .memberbar a:visited
{
color: #336699;
}
.memberbar a:hover
{
color: #0099FF;
}


/* Normal, standard links. */
a:link
{
color: #336699;
}
a:visited
{
color: #336699;
}
a:hover
{
}

/* Navigation links - for the link tree. */
.nav, .nav:link, .nav:visited
{
color: #336699;
}
a.nav:hover
{
color: #0099FF;
}

/* Tables should show empty cells. */
table
{
}

/* By default (td, body..) use verdana in black. */
body, td, th , tr
{
color: #000000;
}

/* The main body of the entire forum. */
body
{
background-color: #99CCFF;
}

/* Input boxes - just a bit smaller than normal so they align well. */
input, textarea, button
{
color: #000000;
}
input, button
{
}

textarea
{
color: #000000;
}

/* All input elements that are checkboxes or radio buttons. */
input.check
{
}

/* Selects are a bit smaller, because it makes them look even better 8). */
select
{
color: #000000;
}

/* Standard horizontal rule.. ([hr], etc.) */
hr, .hrcolor
{
color: #666666;
background-color: #666666;
}


/* A quote, perhaps from another post. */
.quote
{
color: #000000;
background-color: #E6EFFA;
border: 1px solid #000000;
}

/* A code block - maybe even PHP ;). */
.code
{
color: #000000;
background-color: #EEEEEE;
/* Put a nice border around it. */
border: 1px solid #000000;
}

/* The "Quote:" and "Code:" header parts... */
.quoteheader, .codeheader
{
color: #000000;
}


/* /me uses this a lot. (emote, try typing /me in a post.) */
.meaction
{
color: red;
}

/* Highlighted text - such as search results. */
.highlight
{
background-color: yellow;
}
/* The new icon */

.newicon a:link, .newicon a:visited
{
        background-color: #FFFFFF;
        border: #6699CC 1px solid;
        color: #666666;
}

/* Alternating backgrounds for posts, and several other sections of the forum. */
.windowbg
{
color: #000000;
background: #DDE9F7 url(images/lightblue/windowbg.gif) repeat-y;
}
.windowbg2
{
color: #000000;
background: #FAFCFF url(images/lightblue/windowbg2.gif) repeat-x;
}
.windowbg3
{
color: #000000;
background: #C1DEFC url(images/lightblue/windowbg3.gif) repeat-y;
}
/* the today container in calendar */
.calendar_today
{
background-color: #FFFFFF;
}

/* These are used primarily for titles, but also for headers (the row that says what everything in the table is.) */
.titlebg, tr.titlebg th, tr.titlebg td, .titlebg2, tr.titlebg2 th, tr.titlebg2 td
{
color: black;
background-color: #C1DEFC;
background-image: url(images/lightblue/titlebg.gif);
border-bottom: solid 1px #9BAEBF;
border-top: solid 1px #FFFFFF;
}
.titlebg, .titlebg a:link, .titlebg a:visited
{
color: black;
}

.titlebg a:hover
{
color: #404040;
}
/* same as titlebg, but used where bold text is not needed */
.titlebg2 a:link, .titlebg2 a:visited
{
color: black;
}

.titlebg2 a:hover
{
}
.titlebg3, tr.titlebg3 th, tr.titlebg3 td
{
color: #FFFFFF;
background-color: #C1DEFC;
background-image: url(images/lightblue/titlebg.gif);
background-repeat: repeat-x;
}

/* This is used for categories, page indexes, and several other areas in the forum.
.catbg and .catbg2 is for boardindex, while .catbg3 is for messageindex and display headers*/
.catbg , tr.catbg td , .catbg3 , tr.catbg3 td
{
background-image: url(images/lightblue/catbg.gif);
background-color: #7BA9DB;
color: #FFFFFF;
}
.catbg2 , tr.catbg2 td
{
background-image: url(images/lightblue/catbg.gif);
background-color: #7BA9DB;
color: #FFFFFF;
}
.catbg, .catbg2, .catbg3
{
border-bottom: solid 0px #375576;
background-repeat: repeat-x;
}
.catbg, .catbg2
{
}
.catbg3, tr.catbg3 td, .catbg3 a:link, .catbg3 a:visited
{
color: #FFFFFF;
}
.catbg a:link, .catbg a:visited , .catbg2 a:link, .catbg2 a:visited
{
color: #FFFFFF;
}
.catbg a:hover, .catbg2 a:hover, .catbg3 a:hover
{
color: #E0E0FF;
}
/* This is used for tables that have a grid/border background color (such as the topic listing.) */
.bordercolor
{
background-color: #CCD7DD;
}

/* This is used on tables that should just have a border around them. */
.tborder
{
border: 1px solid #6699CC;
background-color: #FFFFFF;
}



/* Sometimes there will be an error when you post */
.error{
color: red;
}


/* definitions for the main tab, active means the tab reflects which page is displayed */
.maintab_first, .maintab_back, .maintab_last, .maintab_active_first, .maintab_active_back, .maintab_active_last
{
color: #FFFFFF;
}

.maintab_first
{
background-image: url(images/lightblue/maintab_first.gif);
}
.maintab_back
{
background-image: url(images/lightblue/maintab_back.gif);
}
.maintab_last
{
background-image: url(images/lightblue/maintab_last.gif);
}
.maintab_active_first
{
background-image: url(images/lightblue/maintab_active_first.gif);
}
.maintab_active_back
{
background-image: url(images/lightblue/maintab_active_back.gif);
}
.maintab_active_last
{
background-image: url(images/lightblue/maintab_active_last.gif);
}

/* how links behave in main tab. */
.maintab_back a:link , .maintab_back a:visited, .maintab_active_back a:link , .maintab_active_back a:visited
{
color: #FFFFFF;
}

.maintab_back a:hover, .maintab_active_back a:hover
{
color: #E0E0FF;
}
/* definitions for the mirror tab */
.mirrortab_first, .mirrortab_back, .mirrortab_last, .mirrortab_active_first, .mirrortab_active_back, .mirrortab_active_last
{
color: #FFFFFF;

}
.mirrortab_back, .mirrortab_active_back
{
color: #FFFFFF;
}

.mirrortab_first
{
background-image: url(images/lightblue/mirrortab_first.gif);
}
.mirrortab_back
{
background-image: url(images/lightblue/mirrortab_back.gif);
}
.mirrortab_last
{
background-image: url(images/lightblue/mirrortab_last.gif);
}
.mirrortab_active_first
{
background-image: url(images/lightblue/mirrortab_active_first.gif);
}
.mirrortab_active_back
{
background-image: url(images/lightblue/mirrortab_active_back.gif);
}
.mirrortab_active_last
{
background-image: url(images/lightblue/mirrortab_active_last.gif);
}

/* how links behave in mirror tab. */
.mirrortab_back a:link , .mirrortab_back a:visited, .mirrortab_active_back a:link , .mirrortab_active_back a:visited
{
color: #FFFFFF;
}

.mirrortab_back a:hover, .mirrortab_active_back a:hover
{
color: #E0E0FF;
}

.mainstrip, .mainstrip_first, .mainstrip_last
{
color: #FFFFFF;
}
.mainstrip_first
{
background-image: url(images/lightblue/mainstrip_first.gif);
}
.mainstrip_last
{
background-image: url(images/lightblue/mainstrip_last.gif);
}
.mainstrip
{
background-image: url(images/lightblue/mainstrip.gif);
}
.mainstrip a:link , .mainstrip a:visited
{
color: #FFFFFF;
}

.mainstrip a:hover, .mainstrip a:hover
{
color: #E0E0FF;
}
Logged
-Wolverine
Moderator
Joomla Guru
*****

Karma: +376/-34
Offline Offline

Posts: 3393


Lead Developer


View Profile WWW
Re: SMF template get totally messed up - Please help
« Reply #3 on: July 21, 2006, 10:34:34 AM »

merge the duplicates, like body etc.
Logged

Need help?  Check Here First!
Get the JSMF User Guide
SEARCH this forum.
vn4m
Joomla Newbie
*

Karma: +0/-0
Offline Offline

Posts: 3


View Profile
Re: SMF template get totally messed up - Please help
« Reply #4 on: July 21, 2006, 06:01:16 PM »

I am sorry. No idea how I could merge the duplicate.

1. I don't know which one is a duplicate, which one is not

2. How do I merge them? Copy and put them in one or else?

Could you please be more specific?
Logged
-Wolverine
Moderator
Joomla Guru
*****

Karma: +376/-34
Offline Offline

Posts: 3393


Lead Developer


View Profile WWW
Re: SMF template get totally messed up - Please help
« Reply #5 on: July 21, 2006, 07:08:19 PM »

you have a body element in J! and a body element in SMF.  If you don't understand that then it is time for you to search out some tutorials on CSS.  Sorry, I don't have the time to explain further.
Logged

Need help?  Check Here First!
Get the JSMF User Guide
SEARCH this forum.
Pages: [1] Go Up Print 
« previous next »
Jump to:  



Login with username, password and session length

Powered by MySQL Powered by PHP Joomla Forum | Powered by SMF 1.1 RC1.
© 2001-2005, Lewis Media. All Rights Reserved.
Joomla Bridge by JoomlaHacks.com
Valid XHTML 1.0! Valid CSS!

Joomla Hacks is a Joomla Components, Joomla Modules, Joomla Templates, & Joomla Mambots resource portal. None of the text or images in this public website may be copied without the expressed written consent of the authors. Copyright 2005 by JoomlaHacks.com. Powered by Joomla. All rights reserved.
Terms of Use
Joomla Hacks



Joomla Hacks
German Lang French Lang Italian Lang Spanish Lang Japanese Lang Chinese Lang
MamboBuzz.com
Search Contact About Advertise Blogs Topsites Submit News Register Login