Need alittle help with a theme! [Theme stylesheets (CSS) help]

1

Need alittle help with a theme!

2007/3/23 4:13
fords8
Just popping in
Posts: 11
Since: 2007/3/16

Hello all!

I am using the theme below. I would like the center (the white part), togo all the way over to the right of the page when viewing. I am not sure how to get rid of the blue-ish column on the right.

Resized Image

So I guess you could say I only want two columns instead of three. Not sure what to edit in the .CSS file.

Thanks!

2

Re: Need alittle help with a theme!

2007/3/23 5:06
FeraTechInc
Just popping in
Posts: 95
Since: 2007/3/19

Uhh... I'm not sure what you mean. That blue in the background isn't actually considered a column. It's just the background.

Are you trying to get your site to stretch all the way to the right? If so you need to change your header.html and footer.html

You have to look the table code. You can look at the header.html file from any original xoop theme that has the look you want and copy over the table formatting to your new theme.

I'm not sure if XOOPS lets you edit the header.html file so a mod would probably give you a better idea.

3

Re: Need alittle help with a theme!

2007/3/23 5:12
fords8
Just popping in
Posts: 11
Since: 2007/3/16

Yeah, I want the white togo over all the way to the right of the page. No blue at all.

EDIT: That should move the blocks over too! Right?

4

Re: Need alittle help with a theme!

2007/3/23 9:09
stefan88
Community Support Member
Posts: 1086
Since: 2004/9/20

Hi,

Not shure without the actual CSS file - it could be in several places.
To start somewhere - check if there is body{...} in the css and if there is "width: ???px;". If there is, change it to "width: 100%;"

..

5

Re: Need alittle help with a theme!

2007/3/23 13:57
fords8
Just popping in
Posts: 11
Since: 2007/3/16

Here is the style.css from the above theme.

 body 
{ 
    color: black; 
    font-family: Verdana,Arial,Sans-serif; 
    background-color: #275078; 
    margin: 0px; 
} 
table 
{ 
    width: 100%; 
    font-size: 11px; 
} 
table#okvir 
{ 
    background-color: #FFFFFF; 
    width: 790px; 
} 
table td 
{ 
    padding: 0; 
    border-width: 0; 
    vertical-align: top; 
    font-family: Verdana, Arial, Helvetica, sans-serif; 
} 
a 
{ 
    color: #002B55; 
    text-decoration: none; 
    font-weight: bold; 
    background-color: transparent; 
} 
a:hover 
{ 
    color: #ff6600; 
    text-decoration: underline; 
} 
ul 
{ 
    margin: 2px; 
    padding: 2px; 
    list-style: decimal inside; 
    text-align: left; 
} 
li 
{ 
    margin-left: 2px; 
    list-style: square inside; 
    color: #2F5376; 
} 
.item 
{ 
    color: #0D0D0D; 
    border: 1px solid #C4CAD0; 
    margin: 3px; 
} 
.item_col 
{ 
    color: #384149; 
    border: 1px solid #C4CAD0; 
    background-color: #FFFFFF; 
    margin: 3px; 
} 
.itemHead 
{ 
    color: #242424; 
    border-bottom: 1px solid #666666; 
    padding-top: 4px; 
    padding-bottom: 2px; 
    padding-left: 10px; 
    background-color: #E6E6E6; 
    background-repeat: repeat; 
    background-image: url('images/head_bg.gif'); 
} 
.itemInfo 
{ 
    text-align: right; 
    padding: 3px; 
    background-color: #FFFFFF; 
} 
.itemTitle a 
{ 
    font-size: 13px; 
    font-weight: bold; 
    font-variant: small-caps; 
    color: #004080; 
    background-color: transparent; 
} 
.itemPoster 
{ 
    font-size: 80%; 
    font-style: italic; 
} 
.itemPostDate 
{ 
    font-size: 80%; 
    font-style: italic; 
} 
.itemStats 
{ 
    font-size: 80%; 
    font-style: italic; 
} 
.itemBody 
{ 
    padding-left: 5px; 
} 
.itemText 
{ 
    margin-top: 5px; 
    margin-bottom: 5px; 
    line-height: 1.5em; 
} 
.itemText:first-letter 
{ 
    font-size: 133%; 
    font-weight: bold; 
} 
.itemFoot 
{ 
    text-align: left; 
    padding: 7px; 
    background-color: #FFFFFF; 
    font-size: 11px; 
    background-image: url('images/item_foot.gif'); 
} 
.itemAdminLink 
{ 
    font-size: 90%; 
} 
.itemPermaLink 
{ 
    font-size: 90%; 
} 
th 
{ 
    background-color: #BBBBBB; 
    color: #004080; 
    padding: 2px; 
    vertical-align: middle; 
    font-family: Verdana, Arial, Helvetica, sans-serif; 
} 
td#headerbanner 
{ 
    width: 100%; 
    background-color: #FFFFFF; 
    vertical-align: middle; 
} 
td#headerbar 
{ 
    height: 29px; 
    background-color: #939393; 
    color: #FFFFFF; 
    line-height: 27px; 
    padding-left: 6px; 
    padding-right: 7px; 
    border-top: 1px solid #000000; 
    border-bottom: 1px solid #000000; 
} 
td#headerbar a 
{ 
    color: #FFFFFF; 
} 
td#headerbar a:hover 
{ 
    color: #FF8040; 
} 
td#leftcolumn 
{ 
    width: 170px; 
    font-size: 11px; 
    border-right: 1px solid #5799B5; 
    background-color: #D0E2EA; 
} 
td#leftcolumn th 
{ 
    vertical-align: bottom; 
    border-bottom: 1px dashed #8699B5; 
    background-color: transparent; 
    color: #464646; 
} 
td#leftcolumn div.blockTitle 
{ 
    padding: 3px; 
    color: #FFFFFF; 
    font-weight: bold; 
    font-size: 10px; 
    background-color: #004080; 
    padding-left: 18px; 
    background-image: url('images/puce.gif'); 
    background-repeat: no-repeat; 
    background-position: left; 
} 
td#leftcolumn div.blockContent 
{ 
    padding: 2px; 
    line-height: 120%; 
    line-height: 120%; 
} 
td#centercolumn 
{ 
    font-size: 12px; 
    color: #464646; 
    padding-left: 4px; 
    padding-right: 4px; 
    width: 100%; 
} 
td#centercolumn th 
{ 
    color: #004080; 
    background-color: #FFFFFF; 
} 
td#centerCcolumn div.blockTitle 
{ 
    padding: 2px; 
    color: #313131; 
    font-weight: bold; 
    margin-top: 0px; 
    margin-right: 0px; 
    margin-left: 0px; 
    font-size: 10px; 
    margin-bottom: 5px; 
    padding-left: 13px; 
    background-image: url('images/item_foot.gif'); 
    background-position: bottom; 
    border-bottom: 1px solid #C4CAD0; 
    text-transform: uppercase; 
} 
td#centerCcolumn div.blockContent 
{ 
    margin-right: 0px; 
    margin-left: 0px; 
    margin-bottom: 8px; 
    line-height: 120%; 
} 
td#centerLcolumn 
{ 
    width: 50%; 
    padding: 0px 0px 0px 0px; 
} 
td#centerLcolumn div.blockTitle 
{ 
    padding: 2px; 
    color: #313131; 
    font-weight: bold; 
    margin-top: 0px; 
    margin-right: 0px; 
    margin-left: 0px; 
    font-size: 10px; 
    margin-bottom: 5px; 
    padding-left: 13px; 
    background-image: url('images/item_foot.gif'); 
    background-position: bottom; 
    border-bottom: 1px solid #C4CAD0; 
    text-transform: uppercase; 
} 
td#centerLcolumn div.blockContent 
{ 
    margin-right: 0px; 
    margin-left: 0px; 
    line-height: 120%; 
    padding: 2px; 
} 
td#centerRcolumn 
{ 
    width: 50%; 
    padding: 0px 0px 0px 0px; 
} 
td#centerRcolumn div.blockTitle 
{ 
    padding: 2px; 
    color: #313131; 
    font-weight: bold; 
    margin-top: 0px; 
    margin-right: 0px; 
    margin-left: 0px; 
    font-size: 10px; 
    margin-bottom: 5px; 
    padding-left: 18px; 
    background-image: url('images/item_foot.gif'); 
    background-position: bottom; 
    border-bottom: 1px solid #C4CAD0; 
    text-transform: uppercase; 
} 
td#centerRcolumn div.blockContent 
{ 
    margin-right: 0px; 
    margin-left: 0px; 
    margin-bottom: 2px; 
    line-height: 120%; 
    padding: 2px; 
} 
td#rightcolumn 
{ 
    width: 160px; 
    font-size: 11px; 
    border-left: 1px solid #C4CAD0; 
    background-color: #F8F8F8; 
} 
td#rightcolumn th 
{ 
    vertical-align: bottom; 
    border-bottom: 1px dashed #8699B5; 
    background-color: transparent; 
    color: #464646; 
} 
td#rightcolumn div.blockTitle 
{ 
    padding: 3px; 
    color: #5F5F5F; 
    font-weight: bold; 
    margin-top: 0px; 
    margin-right: 0px; 
    margin-left: 0px; 
    font-size: 10px; 
    background-color: #CDCDCD; 
    margin-bottom: 2px; 
    padding-left: 20px; 
    background-image: url('images/puce_right.gif'); 
    background-repeat: no-repeat; 
    background-position: left; 
} 
td#rightcolumn div.blockContent 
{ 
    padding: 3px; 
    line-height: 120%; 
} 
td#mainmenu a 
{ 
    color: #004080; 
    font-size: 11px; 
    display: block; 
    background-image: url('images/menu.gif'); 
    background-repeat: no-repeat; 
    background-position: left; 
    padding-left: 15px; 
    font-weight: bold; 
} 
td#mainmenu a:hover 
{ 
    color: #FF0000; 
    background-image: url('images/menu-hover.gif'); 
    background-repeat: no-repeat; 
    background-position: left; 
} 
td#mainmenu a.menuTop 
{ 
    padding-left: 15px; 
} 
td#mainmenu a.menuMain 
{ 
    padding-left: 15px; 
} 
td#mainmenu a.menuSub 
{ 
    padding-left: 23px; 
    color: #9F0000; 
    font-weight: normal; 
} 
td#usermenu a 
{ 
    color: #44819B; 
    font-weight: normal; 
    font-size: 10px; 
    padding-left: 20px; 
    padding-top: 1px; 
    padding-bottom: 1px; 
    background-image: url('images/menu_user.gif'); 
    background-repeat: no-repeat; 
    background-position: left; 
} 
td#usermenu a:hover 
{ 
    color: #FF0000; 
    background-image: url('images/menu_user_hover.gif'); 
    background-repeat: no-repeat; 
    background-position: left; 
} 
td#usermenu a.highlight 
{ 
    background-color: #fcc; 
} 
.head 
{ 
    font-weight: bold; 
    background-repeat: repeat-x; 
    background-position: left; 
    color: #373737; 
    height: 24px; 
    line-height: 22px; 
    text-align: center; 
    background-color: #DFE2E6; 
} 
.even 
{ 
    background-color: #F3F4F5; 
    padding: 5px; 
} 
.odd 
{ 
    background-color: #FAFAFA; 
    padding: 5px; 
} 
.foot 
{ 
    padding: 5px; 
    font-weight: bold; 
} 
tr.even td 
{ 
    background-color: transparent; 
    padding: 5px; 
} 
tr.odd td 
{ 
    background-color: transparent; 
    padding: 5px; 
} 
div.errorMsg 
{ 
    background-color: #FFCCCC; 
    text-align: center; 
    border-top: 1px solid #DDDDFF; 
    border-left: 1px solid #DDDDFF; 
    border-right: 1px solid #AAAAAA; 
    border-bottom: 1px solid #AAAAAA; 
    font-weight: bold; 
    padding: 10px; 
} 
div.confirmMsg 
{ 
    background-color: #DDFFDF; 
    color: #136C99; 
    text-align: center; 
    border-top: 1px solid #DDDDFF; 
    border-left: 1px solid #DDDDFF; 
    border-right: 1px solid #AAAAAA; 
    border-bottom: 1px solid #AAAAAA; 
    font-weight: bold; 
    padding: 10px; 
} 
div.resultMsg 
{ 
    background-color: #CCCCCC; 
    color: #333333; 
    text-align: center; 
    border-top: 1px solid silver; 
    border-left: 1px solid silver; 
    font-weight: bold; 
    border-right: 1px solid #666666; 
    border-bottom: 1px solid #666666; 
    padding: 10px; 
} 
div.xoopsCode 
{ 
    background: #FFFFFF; 
    border: 1px inset #000080; 
    font-family: "Courier New",Courier,monospace; 
    padding: 0px 6px 6px 6px; 
} 
div.xoopsQuote 
{ 
    background: #FFFFFF; 
    border: 1px inset #000080; 
    font-family: "Courier New",Courier,monospace; 
    padding: 0px 6px 6px 6px; 
} 
.comTitle 
{ 
    font-weight: bold; 
    margin-bottom: 2px; 
} 
.comText 
{ 
    padding: 2px; 
} 
.comUserStat 
{ 
    font-size: 10px; 
    color: #2F5376; 
    font-weight: bold; 
    border: 1px solid silver; 
    background-color: #ffffff; 
    margin: 2px; 
    padding: 2px; 
} 
.comUserStatCaption 
{ 
    font-weight: normal; 
} 
.comUserStatus 
{ 
    margin-left: 2px; 
    margin-top: 10px; 
    color: #2F5376; 
    font-weight: bold; 
    font-size: 10px; 
} 
.comUserRank 
{ 
    margin: 2px; 
} 
.comUserRankText 
{ 
    font-size: 10px; 
    font-weight: bold; 
} 
.comUserRankImg 
{ 
    border: 0; 
} 
.comUserImg 
{ 
    margin: 2px; 
} 
.comDate 
{ 
    font-weight: normal; 
    font-style: italic; 
    font-size: smaller; 
} 
.comDateCaption 
{ 
    font-weight: bold; 
    font-style: normal; 
} 
input 
{ 
    font: 11px verdana, arial, helvetica, sans-serif; 
} 
textarea 
{ 
    border: 1px solid #8699B5; 
    width: 400px; 
    font: 11px verdana, arial, helvetica, sans-serif; 
    background-color: #F5F5F5; 
} 
input.formTextBox 
{ 
    border: 1px solid #8699B5; 
    background: #F5F5F5; 
    font: 11px verdana, arial, helvetica, sans-serif; 
} 
select 
{ 
    border: 1px solid #8699B5; 
    font: 11px verdana, arial, helvetica, sans-serif; 
    background-color: #F5F5F5; 
} 
.pozdrav 
{ 
    background-color: #004080; 
    padding: 5px; 
    font-size: 11px; 
    color: #DDEBF0; 
    border-top: 1px solid #ffffff; 
} 
.pozdrav a 
{ 
    color: #DDEBF0; 
} 
.vrijeme 
{ 
    background-color: #004080; 
    padding-top: 5px; 
    font-size: 10px; 
    color: #DDEBF0; 
    border-top: 1px solid #ffffff; 
} 
.headerprvi 
{ 
    background-color: #004080; 
    color: #DDEBF0; 
    font-weight: bold; 
    vertical-align: middle; 
    border-top: 1px solid #ffffff; 
} 
form 
{ 
    font-size: 11px; 
    color: #787878; 
} 
.loginlink 
{ 
    background-image: url('images/btn_bullet.gif'); 
    background-repeat: no-repeat; 
    background-position: left; 
    padding-left: 10px; 
} 
.button 
{ 
    font-size: 10px; 
    color: #000000; 
    margin-bottom: 1px; 
} 
.sadrzaj 
{ 
    margin-bottom: 20px; 
} 
.blok 
{ 
    margin-bottom: 6px; 
} 
.forum 
{ 
    background-color: #E2E2E2; 
    font-size: 11px; 
    font-weight: bold; 
    color: #004080; 
    padding: 6px; 
    background-image: url('menu4_bar.gif'); 
} 
.forumprvi 
{ 
    background-color: #F7F9FB; 
    padding: 3px; 
    color: #004080; 
} 
.forumdrugi 
{ 
    background-color: #EFF3F8; 
    padding: 3px; 
    color: #004080; 
} 
.navigacijaforum 
{ 
    background-color: #DDDDDD; 
    padding: 5px; 
    color: #004080; 
    border-top: 1px dashed #333333; 
    border-bottom: 1px dashed #333333; 
    font-size: 12px; 
    text-align: center; 
    font-weight: bold; 
} 
.border 
{ 
    border-left: 1px solid #cccccc; 
    border-bottom: 1px solid #cccccc; 
    padding: 3px; 
} 
.borderdesno 
{ 
    border-bottom: 1px solid #cccccc; 
    border-right: 1px solid #cccccc; 
    padding: 3px; 
} 
.forum a 
{ 
    color: #004080; 
} 
.download 
{ 
    padding: 10px; 
} 
.downhead 
{ 
    background-image: url('images/menu2_bar.gif'); 
    color: #FFFFFF; 
    padding: 5px; 
} 
.downloadsvaki 
{ 
    width: 97%; 
    border-top: 1px solid #333333; 
    border-bottom: 1px solid #333333; 
    padding: 5px; 
} 
.tiny 
{ 
    width: 90%; 
} 
.privatnost 
{ 
    color: #DDEBF0; 
    font-size: 10px; 
    text-align: center; 
} 
.privatnost a 
{ 
    color: #DDEBF0; 
} 
td#headmenu a 
{ 
    background-color: #004080; 
    color: #FFFFFF; 
    font-size: 10px; 
    display: block; 
    padding: 5px; 
} 
td#headmenu a:hover 
{ 
    background-color: #BBDDFF; 
    color: #494949; 
} 
td#headmenu a.menuHead 
{ 
    font-size: 10px; 
} 
.dole 
{ 
    width: 790px; 
    margin-top: 5px; 
} 
.blok 
{ 
    margin-bottom: 6px; 
} 
.line 
{ 
    background-image: url('images/back_line.jpg'); 
    background-repeat: repeat-x; 
    background-position: left; 
    border-bottom: 1px solid #000000; 
    border-top: 1px solid #ffffff; 
}

6

Re: Need alittle help with a theme!

2007/3/23 14:23
Anonymous
Posts: 0
Since:

Could the width restriction could be in theme.html?

7

Re: Need alittle help with a theme!

2007/3/23 14:29
stefan88
Community Support Member
Posts: 1086
Since: 2004/9/20

try replacing:

 table#okvir 
{ 
    background-color: #FFFFFF; 
    width: 790px; 
}

with:

 table#okvir 
{ 
    background-color: #FFFFFF; 
    width: [b][color=FF0000]100%[/color][/b]; 
}

..

8

Re: Need alittle help with a theme!

2007/3/24 2:29
fords8
Just popping in
Posts: 11
Since: 2007/3/16

stefan88, thank you! That worked great!

Stats
Goal:	$100.00
Due Date:	Jan 31
Gross Amount:	$0.00
Net Balance:	$0.00
Left to go:	$100.00

Need alittle help with a theme!

Re: Need alittle help with a theme!

Re: Need alittle help with a theme!

Re: Need alittle help with a theme!

Re: Need alittle help with a theme!

Re: Need alittle help with a theme!

Re: Need alittle help with a theme!

Re: Need alittle help with a theme!

Login

Search

Recent Posts

Re: AI circumvent anti spamm

Re: AI circumvent anti spamm

AI circumvent anti spamm

Re: xoops_redirect

Re: Help to import database

Re: Help to import database

Re: xoops_redirect

Re: XOOPS MyMenus 1.54.0 Beta 10

Re: xoops_redirect

Vulnerability in xmnews, xmsocial and xmarticle modules

Who's Online

Donat-O-Meter

Latest GitHub Commits

{{ record.sha.slice(0, 7) }} - {{ record.commit.message | truncate }}