1 Topic by esupergood (edited by esupergood 2009-04-11 12:48)

  • Registered: 2008-11-16
  • Posts: 528

Topic: [request] left column with custom content (£30 Paypal offered)

I want an extension to show a column down the left hand side of my forum.
I should be able to include custom content in there and create separate "blocks" of content.

The width should be changeable in % values

I'll add this to extension request wiki later

If anyone can show me how to do this I'll be happy to send £30 via paypal once it is working. It doesn't have to be an extension. It could be done using css or other code editing etc.

cheers smile

  • Registered: 2008-11-16
  • Posts: 528

Re: [request] left column with custom content (£30 Paypal offered)

It should look something like this but without the portal parts
http://img145.imageshack.us/img145/6489/punchatpy3.jpg

3 Reply by esupergood (edited by esupergood 2009-05-08 11:01)

  • Registered: 2008-11-16
  • Posts: 528

Re: [request] left column with custom content (£30 Paypal offered)

I'm increasing this from £30 to £50.
And I've changed my mind. The column should be on the right hand side not the left. IT should be about 150px wide
And it should work in all styles.

smile

  • Registered: 2007-03-25
  • Posts: 960

Re: [request] left column with custom content (£30 Paypal offered)

wow,

MyFootballCafe.com  is Now Online!
  • Registered: 2008-11-16
  • Posts: 528

Re: [request] left column with custom content (£30 Paypal offered)

I'll take that as a yes. When can you start?

  • Registered: 2007-03-25
  • Posts: 960

Re: [request] left column with custom content (£30 Paypal offered)

u kidding, i am not a coder. i was surprised how bad u wanted this. u told me about this before.

MyFootballCafe.com  is Now Online!
  • Registered: 2008-11-16
  • Posts: 528

Re: [request] left column with custom content (£30 Paypal offered)

I can stick adverts and announcements and other messages in the right column.
I hacked one for 1.2 but I can't manage it this time around for some reason.

  • Registered: 2007-03-25
  • Posts: 960

Re: [request] left column with custom content (£30 Paypal offered)

yes thats the idea, u can tell whoever will do this, that he can seperate the portal by daris, into a one that doesnt have news in the main page. that way all the features like where do u want to show blocks and how many blocks, active topics can still remain there.

MyFootballCafe.com  is Now Online!
  • Registered: 2008-11-16
  • Posts: 528

Re: [request] left column with custom content (£30 Paypal offered)

I just want an empty column that I can fill with HTML but I'm prepared to negotiate. I don't even have £50 to spend but I'll find it from somewhere

  • Registered: 2006-07-31
  • Posts: 254

Re: [request] left column with custom content (£30 Paypal offered)

adding a column to either side is pretty easy, but how would you want to add the content?

and no I'm not offering to do this.

my mind is on a permanent tangent
byUsers forum
  • Registered: 2007-03-25
  • Posts: 960

Re: [request] left column with custom content (£30 Paypal offered)

how how how, tell me rich, i can manage the content. just tell me how to make a column in 1.3

MyFootballCafe.com  is Now Online!
  • Registered: 2008-11-16
  • Posts: 528

Re: [request] left column with custom content (£30 Paypal offered)

rich wrote:

but how would you want to add the content?

I'd just go through cpanel and edit the HTML directly. Either that or edit the HTML offline and upload the file. No punbb admin section needed for me

  • Registered: 2006-07-31
  • Posts: 254

Re: [request] left column with custom content (£30 Paypal offered)

1. adjust this part in your css:

.brd {
    margin: 15px auto 0 auto;
    max-width: 1100px;
    min-width: 700px;
    width: 95%;
    }

That is the portion that sets the width of the main board, excluding the header. So you'd need to adjust the minwidth, and width - perhaps setting them to the same amount.

Add a div just before 

<div id="brd-wrap" class="brd">

in each of your templates, something like:

<div id="mycontent">goes here</div>

then add to your css something like the following:

#mycontent{
float:right;
width:150px; 
}

fairly simple, and culd probably be done slightly better, but that seems to work.
(donation link via http://quirm.net/download/)

my mind is on a permanent tangent
byUsers forum
  • Registered: 2007-03-25
  • Posts: 960

Re: [request] left column with custom content (£30 Paypal offered)

cant get that to work.

Ok i added the

#sidebar{
float:right;
width:160px; 
}

to my css, but i dont understand tpl files.

<div id="sidebar">my content here</div>

but its all messed up, and not in the right bar.

can u show me example. and how to make block like the blue block here.

MyFootballCafe.com  is Now Online!
  • Registered: 2006-07-31
  • Posts: 254

Re: [request] left column with custom content (£30 Paypal offered)

erm, which forum where?

my mind is on a permanent tangent
byUsers forum

16 Reply by SuperMAG (edited by SuperMAG 2009-05-08 18:29)

  • Registered: 2007-03-25
  • Posts: 960

Re: [request] left column with custom content (£30 Paypal offered)

http://sports2all.com/forum/

No, can u please make example of the main.tpl file

MyFootballCafe.com  is Now Online!
  • Registered: 2006-07-31
  • Posts: 254

Re: [request] left column with custom content (£30 Paypal offered)

Its a bit difficult to tell exactly where you want the sidebar to begin. Do you want, as I think you do, it to be from the login/register section downwards?

Anyway assuming that, I can see where to insert it in the standard template, just before this:

<div id="brd-main">

so you would end up with:

<div id="sidebar">whatever content</div>
<div id="brd-main">

and it would be the css for brd-main that would need altering width wise.

As you have a specific them already in place, it might be better if you sent those to me, and I'll see what I can do. email me at elfin@elfden.co.uk

my mind is on a permanent tangent
byUsers forum

18 Reply by SuperMAG (edited by SuperMAG 2009-05-08 19:57)

  • Registered: 2007-03-25
  • Posts: 960

Re: [request] left column with custom content (£30 Paypal offered)

for example i did this:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" <!-- forum_local -->>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- forum_head -->
</head>
<body>

<!-- forum_include "mainheader.php" -->
<div id="brd-wrap" class="brd">
<div <!-- forum_page -->>


<div id="brd-navlinks" class="gen-content">
    <!-- forum_navlinks -->
    <!-- forum_admod -->
</div>


<div id="brd-visit" class="gen-content">
    <!-- forum_welcome -->
    <!-- forum_visit -->
</div>

<!-- forum_announcement -->

<div class="hr"><hr /></div>

<div id="sidebar">

<script type="text/javascript"><!--
google_ad_client = "pub-8997487508131027";
/* 160x600, created 5/8/09 */
google_ad_slot = "3404993759";
google_ad_width = 160;
google_ad_height = 600;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

</div>

<div id="brd-main">
    <!-- forum_main_title -->
    <!-- forum_crumbs_top -->
    <!-- forum_main_menu -->
    <!-- forum_main_pagepost_top -->
    <!-- forum_main -->
    <!-- forum_main_pagepost_end -->
    <!-- forum_crumbs_end -->
</div>
<!-- forum_qpost -->

<!-- forum_info -->

<div class="hr"><hr /></div>

<div id="brd-about" class="gen-content">
    <!-- forum_about -->
</div>


<!-- forum_debug -->

</div>
</div>

<!-- forum_include "mainfooter.php" -->

</body>
</html>

but i the ad is showing over the forum.

http://sports2all.com/forum/

click on Ctrl F5 if the ad is not showing with u

MyFootballCafe.com  is Now Online!
  • Registered: 2006-07-31
  • Posts: 254

Re: [request] left column with custom content (£30 Paypal offered)

that's fine, you just need to alter #brd-main, adjusting the width until you get the desired effect.

my mind is on a permanent tangent
byUsers forum
  • Registered: 2007-03-25
  • Posts: 960

Re: [request] left column with custom content (£30 Paypal offered)

ok i played with

.brd {
    margin: 15px auto 0 auto;
    max-width: 1060px;
    min-width: 700px;
    width: 95%;
    }

i decreased the size of max to 890 but the ad was still showing over the forums content.

i added float left, but it was still showing.

i have no idea what to do next.

I added a sidebar of 160px.

and i have a full size of the maximum width 1060px

so substitute it and u will get 900 or bitter 890px.

may be portal by daris will help: http://punbb.informer.com/forums/topic/ … -by-daris/


so what i need to modifiy in my css here:


/*************************************************************
A - SETUP
**************************************************************/

/* Start from scratch
-------------------------------------------------------------*/

html, body, /* remove this line if necessary for site integration */
.brd div, .brd p, .brd dl,.brd dt,.brd dd, .brd ul, .brd ol, .brd li,
.brd h1,.brd h2,.brd h3, .brd h4, .brd h5, .brd h6, .brd pre,
.brd form, .brd fieldset, .brd legend, .brd blockquote,
.brd table, .brd th, .brd td {
    margin:0;
    padding:0;
    text-align: left;
    }

.brd fieldset, .brd img, .brd cite {
    border: 0;
    }

.brd br, .brd hr, .brd .hr, .brd .hidden {
    display: none;
    }

.brd table {
    width: 100%
    table-layout: fixed;
    empty-cells: show;
    }

/* Text Setup (Equalise everything before styling)
-------------------------------------------------------------*/

body {
    font-size: 100%;
    }

.brd-page {
    font: 75%/1.5em Verdana, Helvetica, Arial, sans-serif;
    }

.brd h1,.brd h2,.brd h3, .brd h4, .brd h5, .brd h6 {
    font-size: 1em;
    font-weight: normal;
    }

.brd samp, .brd code, .brd pre, .brd option, .brd optgroup,
.brd input, .brd select, .brd textarea, .brd td, .brd th {
    font-size: 1em;
    font-family: Verdana,Helvetica,Arial,sans-serif;
    font-style: normal;
    font-weight: normal;
    }

/* Float Clearing
-------------------------------------------------------------*/

.brd-page:after,
.brd .gen-content:after,
.brd .ct-box:after,
#brd-index .item-head:after,
#brd-index .main-item:after,
#brd-index ul.item-info:after,
.brd .frm-group:after,
.brd .mf-set:after,
.brd .sf-set:after,
.brd .mf-box:after,
.brd .sf-box:after,
.brd .mf-item:after,
.brd .txt-set:after,
.brd .txt-box:after,
.brd .frm-form label:after,
.brd fieldset:after,
.brd span.fld-input:after,
.brd .posthead:after,
.brd .postbody:after,
.brd .postfoot .post-options:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    line-height: 0.0;
    overflow:hidden;
    visibility: hidden;
    clear: both;
    }

/* Hidden items
-------------------------------------------------------------*/

#brd-stats .hn,
#qjump label,
.brd .post .post-byline span,
.brd .post .posthead .post-link span,
.admin .main-subhead,
.brd .main-item .item-info li span.label,
.brd .main-item .item-info li label,
.brd .main-item .you-posted,
.brd .main-item .item-num,
.brd .group-legend,
.brd .group-legend span,
.brd .sf-set legend,
.brd .sf-set legend span,
.brd .main-pagehead .page-info,
.brd p.item-select label,
.brd .mf-extra .mf-field label,
.brd .mf-extra .mf-field .aslabel,
.brd .item-subject .item-nav span,
.brd .post-options a span,
.brd .main-title,
.brd .main-head .hn small,
.brd .entry-title,
.brd .menu-page .main-head {
    font-size: 0;
    left: -999em;
    text-indent: -999em;
    position:absolute;
    line-height: 0em;
    visibility: hidden;
    }


/*************************************************************
B - GLOBAL STYLES
**************************************************************/

/* General Layout
-------------------------------------------------------------*/

.brd {
    padding: 1.3em 2em;
    margin: 0 auto;
    max-width: 1060px;
    min-width: 700px;
    width: 90%;
    }

#brd-redirect, #brd-maint, #brd-util {
    margin: 50px auto 12px auto;
    width: 60%;
    }

.brd-page { /* Confines clearing behaviour within forum wrapper */
    float: left;
    width: 100%;
    position: relative;
    }

.brd .main-content, .brd .gen-content {
    border-style: solid;
    border-width: 1px;
    }

.brd .gen-content {
    padding: 0 1.5em;
    }

#brd-index #brd-about, #brd-index #brd-stats {
    margin-top: 1em;
    }

.brd .main-content,
#brd-index #brd-visit, #brd-qpost,
#brd-index #brd-announcement {
    margin-bottom: 1em;
    }

.brd #brd-announcement {
    padding: 0.5em 1.5em;
    margin-top: 1em;
    /*margin: 0em 0em 1em 0em;*/
    }

.brd #brd-announcement br {
    display: inline;
    }

.brd .main-options {
    border-top: none;
    margin: -1em 0 1em 0;
}

/* Content Text (Default spacing for paragraphs and lists)
-------------------------------------------------------------*/

.brd p, .brd .hn {
    padding: 0.5em 0;
    }

.brd  ul, .brd ol {
    padding: 0.5em 0 0.5em 2em;
    }


.brd ul.spaced {
    padding: 0.25em 0 0.25em 2em;
    }

.brd ul.spaced li {
    padding: 0.25em 0;
    }

/* Headings
-------------------------------------------------------------*/

.brd th {
    font-size: 1.084em;
    padding: 0.462em 1.417em;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    }

.brd .main-head, .brd .main-foot {
    border-style: solid;
    border-width: 1px;
    padding: 0 1.417em;
    }

.brd .main-head .hn, .brd .main-foot .hn {
    font-size: 1.084em;
    font-weight: bold;
    padding-right: 10em;
    }

.brd h2.main-subhead {
    border-style: solid;
    border-width: 1px;
    font-size: 1.084em;
    padding: 0.462em 10em 0.426em 1.417em;
    }

.brd .column-title {
    border-style: solid;
    border-width: 1px;
    position: relative;
    margin-bottom: -1px;
    }

.brd .main-subhead {
    border-style: solid;
    border-width: 1px;
    border-bottom: none;
    }

.brd .main-subhead .hn {
    font-size: 1.084em;
    padding: 0.462em 1.417em;
    position: relative;
    }

.brd .main-foot {
    margin-top: -1em;
    }

.brd #brd-announcement h1, .brd .main-extensions .ct-legend, .brd .main-hotfixes .ct-legend {
    border-bottom-style: solid;
    border-bottom-width: 1px;
    font-size: 1.1em;
    font-weight: bold;
    }

.brd #brd-announcement h1 {
    margin-bottom: 0.5em;
    }

.brd .main-pagehead .hn {
    padding: 0.5em 0;
    }

.brd .content-head {
    margin: 0.5em 1.417em 0;
    }

.brd .content-head .hn {
    font-size: 1.084em;
    border-style: none none double none;
    border-width: 3px;
    padding: 0.462em 0;
    }


/*************************************************************
C - COMMON CONTENT TYPES (RE-USABLE FORMATS)
**************************************************************/

/* Option lists
-------------------------------------------------------------*/

.brd .options span {
    padding: 0 0 0 0.5em;
    margin: 0 0 0 0.5em;
    }

.brd .options span.first-item {
    border-left: 0;
    padding-left: 0;
    margin-left: 0;
    }

.brd .extension .options, .brd .hotfix .options {
    border-top-style: dashed;
    border-top-width: 1px;
    }

/* Content Containers
-------------------------------------------------------------*/

.brd .ct-box {
    border-style: solid;
    border-width: 1px;
    margin: 1.417em;
    padding: 0.5em 1em;
    position: relative;
    }

.brd .ct-box li {
    padding: 0;
    margin: 0 0 0.7em 0;
    }

.brd .ct-set {
    border-style: solid;
    border-width: 1px;
    margin: 1.417em;
    padding: 0 0 0 17em;
    position: relative;
    }

.brd .ct-group {
    border-style: solid;
    border-width: 1px;
    margin: 1.417em;
    }

.brd .frm-group .ct-set {
    border-style: solid none none none;
    margin: 0;
    }

.brd .ct-group .ct-set {
    border-style: solid none none none;
    margin: 0 1em;
    padding: 0 0 0 16em;
    }
.brd .ct-group .group-item1 {
    border: none;
    }

.brd .ct-group .set1, .brd .frm-group .set1 {
    border-top: none;
    }

.brd .ct-group .ct-box, .brd .frm-group .ct-box {
    border-style: none;
    margin: 0;
    }

.brd .ct-group .ct-set .ct-box, .brd .ct-set .ct-box,
.brd .frm-group .ct-set .ct-box {
    border-style: none;
    margin: 0;
    }

.brd .ct-group .set1 {
    border-top: 0;
    }

.brd .ct-set .ct-legend {
    float: left;
    margin-left: -17em;
    width: 16em;
    display: inline;
    position: relative;
    text-align: right;
    font-weight: bold;
    }

.brd .ct-set ul {
    padding-left: 0;
    list-style: none;
    }

.brd .ct-box div {
    padding: 0.5em 0;
    }

.brd .ct-box p.options {
    float: none;
    }

.brd .ct-box .info-list {
    padding-bottom: 0;
    }

 /* User Identity
-------------------------------------------------------------*/

.brd .user-ident {
    padding-left: 0;
    list-style: none;
    }

.brd .user-ident .username a,
.brd .user-ident .username strong {
    font-size: 1.167em;
    font-weight: bold;
    }

.brd .user-ident .username a,
.brd .user-ident .username a:link,
.brd .user-ident .username a:visited {
    text-decoration: none;
    }

.brd .user-ident .username a:hover,
.brd .user-ident .username a:active,
.brd .user-ident .username a:focus {
    text-decoration: underline;
    }

.brd .user-ident .usertitle {
    font-weight: bold;
    }

.brd .user-ident .useravatar {
    padding: 0.25em 0;
    }

.brd .user-ident .useravatar img {
    display: block;
    }

 /* Message Boxes
-------------------------------------------------------------*/

.brd .main-message {
    padding: 0.5em 1.417em;
    }

.brd .main-message p span {
    display: block;
    padding-top: 0.5em;
    }

/* Section Menus (By Default - Profile and Admin)
-------------------------------------------------------------*/

.brd .main-menu, .brd .admin-menu {
    border: 0;
    padding: 0.4em 0 0.2em 0.75em;
    }

.brd .main-menu ul, .brd .admin-menu ul {
    list-style-type: none;
    float: left;
    padding: 0;
    }

.brd .main-menu li, .brd .admin-menu li {
    font-size: 1.084em;
    float: left;
    display: inline;
    }

.brd .main-menu a, .brd .admin-menu a {
    float: left;
    position: relative;
    padding: 0.2em 0.75em 0.4em 0.75em;
    }

.brd .main-menu li.active a, .brd .admin-menu li.active a {
    font-weight: bold;
    }

.brd .main-menu li.first-item, .brd .admin-menu li.first-item {
    border-left: 0;
    }

.brd .admin-submenu {
    border-style: solid;
    border-width: 0px 1px 0px 1px;
    }

.brd .admin-submenu ul {
    padding: 0.5em 0;
    list-style: none;
    }

.brd .admin-submenu li {
    display: inline;
    margin-right: 0.75em;
    }

/*************************************************************
D - COMMON INTERFACE ELEMENTS
**************************************************************/

/* Logo and Tagline
-------------------------------------------------------------*/

#brd-head {
    padding-bottom: 0.75em;
    padding-top: 1em;
    }

#brd-title {
    padding-bottom: 0;
    }

#brd-title a, #brd-title strong {
    font-size: 1.5em;
    text-decoration: none;
    font-weight: normal;
    }

#brd-desc {
    font-size: 1.084em;
    padding-top: 0;
    padding-bottom: 0;
    }

/* Primary navigation
-------------------------------------------------------------*/

#brd-navlinks ul {
    margin: 0;
    padding: 0.5em 0;
    float: left;
    }

#brd-navlinks li {
    display: inline;
    margin-right: 1em;
    }

#brd-navlinks li a {
    font-size: 1.167em;
    text-decoration: none;
    }

#brd-admod {
    float: right;
    text-align: right;
    }

#brd-admod span {
    margin-left: 0.75em;
    }

#brd-access {
    text-align: right;
    padding: 0;
    height: 0;
    margin: 0;
    position: absolute;
    background: transparent;
    }

#brd-access a, #brd-access a:link, #brd-access a:visited {
    height: 2em;
    padding: 0 1.3em;
    line-height: 2em;
    position: absolute;
    left: -999em;
    margin: 1px;
    width: 12em;
    }

#brd-access a:hover, #brd-access a:active, #brd-access a:focus {
    text-indent: 0;
    background: #000;
    position: static;
    float: right;
    }


/* Welcome box
-------------------------------------------------------------*/

#brd-visit #welcome {
    float: left;
    }

#brd-visit #visit-links {
    text-align: right;
    float: right;
    }

/* Paging and posting
-------------------------------------------------------------*/

#brd-pagepost-end {
    border-top: none;
    }

#brd-pagepost-top {
    border-bottom: none;
    }

.brd .paging {
    float: left;
    }

.brd .posting {
    text-align: right;
    float: right;
    }

.brd .paging, .brd .paging * {
    white-space:nowrap;
    }

.brd .paging a, .brd .paging strong, .brd .paging span {
    padding: 0 1em;
    border-left-style: solid;
    border-left-width: 1px;
    float: left;
    }

.brd .paging .first-item, .brd .paging span.pages {
    border-left: 0;
    padding-left: 0;
    }

.brd .posting .newpost {
    font-size: 1.084em;
    font-weight: bold;
    }

/* Breadcrumbs
-------------------------------------------------------------*/

.brd .crumbs .crumblast {
    font-weight: bold;
    }

.brd .crumbs .crumblast  span {
    font-weight: normal;
    }

.brd .crumbs span, .brd crumbs span * {
    white-space: nowrap;
    }

.brd .crumbs {
    margin: 0.5em 0em;
    padding: 0em 1.417em;
    font-size: 1.084em;
    }

/* Statistics
-------------------------------------------------------------*/

#brd-stats {
    border-bottom: 0;
    }

#brd-stats ul {
    list-style: none;
    padding-left: 0;
    }

#brd-stats ul li.st-users {
    float: left;
    clear: both;
    white-space: nowrap;
    }

 #brd-stats ul li.st-activity {
    text-align: right;
    display: block;
    white-space: nowrap;
    }

 #brd-stats li strong {
    font-weight: bold;
    }

#brd-online {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    }

#brd-online .hn, #brd-online p {
    padding-bottom: 0;
    padding-top: 0;
    }

 #brd-online .hn {
    float: left;
    margin-right: 0.5em;
    }

/* Footer
-------------------------------------------------------------*/

#brd-about #qjump {
    float: left;
    padding: 0.5em 0;
    }

#brd-about #qjump div, #qjump label {
    padding: 0;
    border: none;
    }

#brd-about #copyright {
    text-align: right;
    margin: 0;
    }

#querytime {
    text-align: center;
    font-size: 0.9em;
    }

#extensions-used {
    border-bottom: 1px dotted;
}

/* Main and Content Options
-------------------------------------------------------------*/

.brd p.options {
    border-top: none;
    float:right;
    }

.brd .main-modoptions .options {
    text-align: center;
    }

.brd a.feed {
    padding-left: 22px;
    background: url(feed-icon.png) center left no-repeat;
    }

.brd .content-options, .brd .ct-options {
    float: right;
    margin-top: -2.7em;
    padding: 0.5em 1.417em;
    position: relative;
    }

.brd #select-all {
    float: right;
    padding-left: 1em;
    }

/*************************************************************
E - INDEX, FORUMS, SEARCH RESULTS, MODERATE FORUMS
**************************************************************/

/* Header setup generally
-------------------------------------------------------------*/

.brd .item-summary {
    height: 2.5em;
    padding: 0;
    position: relative;
    font-size: 1em;
    }

.brd .item-summary span {
    width: 100%;
    position: absolute;
    left: -999em;
    text-indent: -999em;
    display: block;
    }

.brd .item-summary strong {
    position: absolute;
    left: 999em;
    text-indent: 0;
    padding: 0.5em 0;
    white-space: nowrap;
    font-weight: normal;
    }

.brd .item-summary strong:first-letter {
    text-transform: uppercase;
    }

.brd .item-summary .subject-title {
    padding-left: 1.417em;
    }

.brd .item-summary .info-topics,
.brd .item-summary .info-replies {
    margin-left: 100%;
    text-align: center;
    width: 7em;
    left: 965em;
    }

.brd .item-summary .info-forum {
    margin-left: 100%;
    text-align: center;
    width: 20em;
    left: 952em;
    }
.brd .item-summary .info-posts,
.brd .item-summary .info-views {
    margin-left: 100%;
    text-align: center;
    width: 7em;
    left: 972em;
    }

.brd .item-summary .info-lastpost {
    margin-left: 100%;
    left: 980em;
    }

.brd p.forum-noview .info-replies {
    left: 972em;
    }

/* Content setup generally
-------------------------------------------------------------*/

.brd .main-content .main-item {
    border-top-style: solid;
    border-top-width: 1px;
    overflow: hidden;
    position: relative;
    line-height: 1.3em;
    }


.brd .main-content .main-first-item {
    border-top: none;
    }

.brd .main-content .main-item ul {
    float: right;
    position: relative;
    padding: 0;
    list-style: none;
    }

.brd .main-content .main-item p,
.brd .main-content .main-item .hn {
    padding: 0;
    }

.brd .main-content .main-item .hn .item-status {
    font-weight:normal;
    }

.brd .main-content .main-item .hn .item-status em {
    font-style:normal;
    }

.brd .main-content .main-item .item-subject,
.brd .main-content .main-item li {
    float: left;
    border-left-style: solid;
    border-left-width: 1px;
    margin: 0 -2px -9.7em 0;
    position: relative;
    padding-top: 0.6em;
    padding-bottom: 10.4em;
    }

.brd .main-content .main-item .item-subject {
    overflow: hidden;
    width: 100%;
    }

.brd .main-content .main-item li.info-topics,
.brd .main-content .main-item li.info-forum,
.brd .main-content .main-item li.info-posts,
.brd .main-content .main-item li.info-views,
.brd .main-content .main-item li.info-replies {
    width: 7em;
    text-align: center;
    }

.brd .main-content .main-item li.info-forum {
    width: 20em;
    }

.brd .main-content .main-item li.info-lastpost {
    width: 20em;
    }

.brd .main-content .main-item li.info-lastpost cite {
    overflow: hidden;
    width: 18em;
    }

.brd .main-item li strong {
    font-weight: normal;
    }


/* Setup for Index and Forums
-------------------------------------------------------------*/

.brd .main-content .main-item {
    padding-right: 35em;
    padding-left: 3.75em;
    }

.brd .main-content .main-item .hn {
    position: relative;
    }

.brd .main-content .main-item ul {
    width: 34em;
    right: -35em;
    margin-left: -34em;
    }

.brd .forum-noview .main-item {
    padding-right: 28em;
    }

.brd .forum-noview .main-item ul {
    width: 27em;
    right: -28em;
    margin-left: -27em;
    }

.brd .forum-forums .main-item {
    padding-right: 48em;
    }

.brd .forum-forums .main-item ul {
    width: 47em;
    right: -48em;
    margin-left: -47em;
    }

.brd .main-content .main-item .item-subject span.modlist {
    display: block;
    }

.brd .main-content .main-item .hn strong {
    font-size: 1em;
    }

.brd .main-content .main-item .hn strong span {
    font-weight: normal;
    }

 #brd-index .main-content .main-item .hn span {
    font-size: 1.084em;
    font-weight: bold;
    }
#brd-index .main-content .main-item .hn small {
    font-size: 1em;
    }

.brd .main-content .main-item .item-status {
    font-weight: bold;
    }

.brd .main-content .main-item cite {
    font-style: normal;
    }

.brd .main-content .main-item span.item-nav,
.brd .main-content .main-item span.item-nav * {
    white-space: nowrap;
    font-style: normal;
    }

.brd .main-content .main-item .item-subject .hn,
.brd .main-content .main-item .item-subject p {
    margin: 0 0 0 1.5em;
    }

.brd .main-content .main-item li.info-lastpost cite,
.brd .main-content .main-item li.info-lastpost span,
.brd .main-content .main-item li.info-forum a {
    display: block;
    padding: 0 1em;
    font-style: normal;
    font-weight: normal;
    }

.brd .main-content .main-item li.info-lastpost strong {
    padding: 0 0 0 1em;
    font-style: normal;
    font-weight: normal;
    }

.brd .main-content .main-item li.info-select {
    position: absolute;
    right: 0;
    top: 0;
    padding: 0.3em;
    border-style: none none solid solid;
    border-width: 1px;
    }

.brd .main-content .main-item .icon {
    border-style: solid;
    border-width: 0.5833em;
    height: 0;
    width: 0;
    float: left;
    margin-top: 0.667em;
    margin-left: -2.417em;
    }

.brd .main-content .main-item .hn .posted-mark {
    position: absolute;
    font-size: 2em;
    width: 1em;
    left: -0.5em;
    top: 0;
    }

/*************************************************************
F - MAIN CONTENT - FORMS
**************************************************************/

/* Generally
-------------------------------------------------------------*/

.brd .frm-group {
    border-top-style: solid;
    border-top-width: 1px;
    margin: 1.417em;
    padding: 1.3em 0pt 0em;
    }

.brd .group1{
    border-top: none;
    padding-top: 0;
    }

.brd .sf-box, .brd .mf-box, .brd .txt-box {
    margin: 1.417em;
    padding: 0.3em 0;
    position: relative;
    }

.brd .sf-set, .brd .mf-set, .brd .txt-set {
    margin: 1.417em;
    padding: 0 0 0 17em;
    position: relative;
    }

.brd .sf-set .sf-box, .brd .mf-set .mf-box, .brd .txt-set .txt-box {
    margin: 0;
    }

.brd .frm-group .sf-set, .brd .frm-group .mf-set, .brd .frm-group .txt-set {
    margin: 0;
    }

.brd .text input, .brd .select select {
    font-size: 1.084em;
    }

.brd .frm-buttons {
    margin: 0.75em 1.417em 1em 1.417em;
    position: relative;
    border-top-style: double;
    border-top-width: 3px;
    padding: 0.8em 0pt 0.3em 18em;
    }

.brd .frm-buttons span.submit {
    margin-right: 0.75em;
    }

.brd span.submit input, .brd span.cancel input {
    overflow: visible;
    padding-left: 0.5em;
    padding-right: 0.5em;
    font-size: 1.084em;
    }

.brd .button-set span.submit {
    padding-left: 1em;
    }

/* Single Field Items (Text, Select, Checkbox)
-------------------------------------------------------------*/

.brd .sf-box label, .brd .sf-box .aslabel {
    float: left;
    padding: 0;
    }

.brd .sf-set .checkbox label {
    padding: 2px 0 2px 3em;
    }

.brd .sf-set .text label span, .brd .sf-set .select label span, .brd .sf-set .aslabel span {
    float: left;
    margin-left: -17em;
    display: block;
    position: relative;
    padding: 2px 0 2px 1em;
    width: 16em;
    text-align:right;
    font-weight:bold;
    }

.brd .sf-set .checkbox label span {
    float: left;
    margin-left: -18em;
    display: block;
    position: relative;
    padding: 0 0 0 2em;
    width: 16em;
    left: -3em;
    text-align:right;
    font-weight:bold;
    }

.brd .sf-set .text label small, .brd .sf-set .select label small {
    display: block;
    text-align: left;
    position: relative;
    margin: 2em 1em 0 1em;
    font-size: 0.917em;
    }

.brd .sf-set .fld-input {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    padding: 0.3em 1em;
    }

.brd .sf-set .checkbox input {
    margin: 2px 0 2px -0.25em;
    height: 1.55em;
    width: 1.55em;
    }

.brd .sf-set .text input:not([title]) { /* Fixes alignment issue in Safari */
    height: 100%;
    }

.brd .sf-set .sf-short input {
    width: 4em;
    }

.brd .sf-set .sf-short label small {
    font-size: 1em;
    padding: 2px 0;
    margin: 0 1em 0 6.5em;
    }


/* Multi-Field Items (Radio/Checkbox Groups)
-------------------------------------------------------------*/

.brd .mf-box .mf-item {
    position: relative;
    top: -0.166em;
    padding: 0.25em 0;
    }

.brd .mf-set legend {
    position: absolute;
    height: 0;
    background: transparent;
    }

.brd .mf-set legend span {
    position: absolute;
    left: -17em;
    width: 16em;
    padding: 0.3em 1em;
    margin: 1px 0 2px 0;
    overflow: hidden;
    display: block;
    text-align: right;
    font-weight: bold;
    }

.brd .mf-set legend span em {
    display: block;
    white-space: normal;
    font-style: normal;
    font-weight:normal;
    font-size: 0.917em;
    }

.brd .mf-item .fld-input {
    position: absolute;
    top: 0.25em;
    left: 0;
    display: block;
    padding: 0 1em;
    }

.brd .mf-item input {
    margin: 0 0 0 -0.25em;
    height: 1.55em;
    width: 1.55em;
    }

.brd .mf-item label {
    padding: 0 0 0 3em;
    float: left;
    }

.brd .mf-set .mf-yesno .mf-item {
    width: 10em;
    float: left;
    }

.brd .mf-set .mf-field {
    float: left;
    padding: 0 1em 0 1em;
    border-left: 1px solid #ccc;
    }

.brd .mf-set .mf-field1 {
    border-left: none;
    }

.brd .mf-set .mf-field label, .mf-set .mf-field .aslabel {
    position: absolute;
    top: -2em;
    display: block;
    }

.brd .mf-set .mf-cell .fld-input {
    position: static;
    padding: 0 0 0 1em;
    border-left: 1px solid #ccc;
    }

.brd .frm-hdgroup {
    padding-top: 2em;
    }

/*.brd .frm-hdgroup .set1 {
    border-top-style: solid;
    border-top-width: 1px;
    }*/

.brd .sf-set .sf-box .sf-forum {
    width: 25em;
    }

.brd .mf-set .mf-box .forum-field {
    width: 25em;
    }

/* Multi Checkbox Widget
-------------------------------------------------------------*/

.brd .checklist {
    min-height: 6em;
    max-height: 9em;
    max-width: 30em;
    overflow: auto;
    border-style: solid;
    border-width: 1px;
    position: relative;
    padding: 0.25em 0.5em;
    margin: 0 1em;
    }

.brd .checklist fieldset {
    height: auto;
    }

.brd .checklist legend,
.brd .checklist legend span {
    font-weight: bold;
    position: static;
    padding: 0;
    height: auto;
    text-align:left;
    }

.brd .checklist .checklist-item {
    position: relative;
    height: auto;
    }

.brd .checklist .checklist-item label {
    display: block;
    padding: 0 0 0 2.25em;
    float: none;
    height: 100%;
    background-color: #fff;
    }

.brd .checklist .checklist-item .fld-input {
    position: absolute;
    left: 0;
    top: 0;
    padding: 0;
    margin: 0;
    }

.brd .checklist .checklist-item input {
    margin: 0;
    height: 1.55em;
    width: 1.55em;
    }


/* Single Field Textareas and Long Inputs (Flexi Width)
-------------------------------------------------------------*/

.brd .txt-box label {
    float: left;
    }

.brd .txt-set label span {
    float: left;
    margin-left: -17em;
    display: block;
    position: relative;
    padding: 2px 1em;
    width: 16em;
    text-align:right;
    font-weight:bold;
    }

.brd .txt-set label small {
    display: block;
    text-align: left;
    position: relative;
    margin: 0 1em 0 -1px;
    padding: 2px 1em;
    font-size: 0.917em;
    z-index: 100;
    }

.brd .txt-set .txt-input {
    position: relative;
    width: 100%;
    }

.brd .txt-set .fld-input {
    display: block;
    padding: 0 0 0 1em;
    }

.brd .txt-set textarea {
    width: 95%;
    }

/* Error handling
-------------------------------------------------------------*/

.brd .req-warn {
    display: none;
    }

.brd #req-msg p em, .brd .required label span em {
    font-style: normal;
    font-weight: normal;
    }

.brd .required label span em {
    float: left;
    font-size: 0.917em;
    line-height: 1.2em;
    width: 100%;
    position: relative;
    }

.brd .txt-set .required label span em {
    margin-bottom: -1.2em;
    }

.brd .req-error {
    display: block;
    }

.brd .required label span  {
    font-weight: bold;
    }

/*************************************************************
G - MAIN CONTENT - TOPICS AND PARSED CONTENT
**************************************************************/

/* Structure
-------------------------------------------------------------*/

.brd .post {
    border-style: solid;
    border-width: 1px;
    position: relative;
    margin: 1.417em;
    margin-top: -1.417em;
    }

.brd .firstpost, .brd .singlepost {
    margin-top: 1.417em;
    }

.brd .main-topic .lastpost {
    border-bottom: 0;
    }

.brd .main-topic .post {
    border-style: solid none;
    margin: 0;
    }

.brd  .main-topic .firstpost {
    border-top: none;
    }

.brd .posthead {
    margin-left: 18em;
    border-style: none none none solid;
    border-width: 1px;
    }

.brd .posthead .hn {
    padding-right: 1.5em;
    padding-left: 1em;
    border-style: none none solid none;
    border-width: 1px;
    }

.brd .post .posthead .post-byline a,
.brd .post .posthead .post-byline strong {
    font-size: 1.167em;
    font-weight: bold;
    text-decoration: none;
    font-style: normal;
    }

.brd .post .posthead .post-byline {
    float: left;
    width: 15.5em;
    padding: 0.5em 1em 0.5em 1.5em;
    margin-left: -19em;
    margin-top: -0.5em;
    position: relative;
    left: -1px;
    overflow: hidden;
    }

.brd .posthead .post-num {
    float:right;
    font-weight: bold;
    }

#brd-modtopic .posthead .hn {
    padding-right: 2.7em;
    }

.brd .posthead .post-title {
    padding: 0 1.5em 0.5em 1em;
    margin-top: -1px;
    position: relative;
    }

.brd .posthead .post-title span {
    display: block;
    width: 100%;
    overflow: hidden
    }

.brd .posthead .post-title a {
    font-size: 1em;
    text-decoration: none;
    font-weight: bold;
    }

.brd .posthead .post-title small,
.brd .posthead .post-title small a {
    font-size: 1em;
    font-weight: normal;
    white-space: nowrap;
    }

.brd .posthead p.item-select {
    position: absolute;
    top: 0;
    right: 0.75em;
    height: 2.5em;
    }

.brd .postbody {
    margin-left: 18em;
    position: relative;
    border-left-style: solid;
    border-left-width: 1px;
    padding: 0.5em 1.5em 0 1em;
    clear: both;
    }

.brd .postfoot {
    padding-left: 18em;
    border-top-style: solid;
    border-top-width: 1px;
    position: relative;
    }

.brd .postfoot .post-options {
    border-left-style: solid;
    border-left-width: 1px;
    }

.brd .postbody .post-author {
    float: left;
    width: 15.5em;
    margin-left: -19em;
    left: -1px;
    position: relative;
    display: inline;
    padding: 0 1em 0.5em 1.5em;
    overflow: hidden;
    margin-top: -1em;
    }


.brd .postbody .post-author ul {
    margin: 0;
    padding: 0 0 0.5em 0;
    list-style: none;
    }

.brd .post .author-ident .useravatar img {
    display: block;
    padding: 0.5em 0;
    }

.brd .post .author-ident .username {
    display: none;
    }

.brd .postbody .author-ident .usertitle {
    font-weight: bold;
    line-height: normal;
    }

.brd .postbody .author-ident .userstatus {
    padding: 0.75em 0 0.25em 0;
    margin: 0;
    line-height: 0.75em;
    width: 100%;
    }

.brd .postbody .author-ident .userstatus span {
    font-size: 0.917em;
    display: block;
    border-left-style: solid;
    border-left-width: 0.7em;
    text-indent: 0.5em;
    }
.brd .postbody .author-info li span strong {
    font-weight: normal;
}
.brd .online .author-ident .userstatus span {
    font-weight: bold;
    }

.brd .postfoot .post-contacts {
    float: left;
    margin-left: -18em;
    width: 15.5em;
    padding: 0.5em 1em 0.5em 1.5em;
    position: relative;
    display: inline;
    left: -1px;
    }

.brd .postfoot .post-actions {
    padding: 0.5em 1.5em 0.5em 1em;
    text-align: right;
    display: block;
    float: right;
    }

.brd .postfoot .post-actions span {
    margin-left: 0.75em;
    }

.brd .postfoot .post-contacts span {
    margin-right: 0.75em;
    }

/* Content
-------------------------------------------------------------*/

.brd .entry-content {
    padding-bottom: 1em;
    overflow: hidden;
    width: 100%;
    font-size: 1.084em;
    }

.brd .entry-content ol {
    padding-left: 2.5em;
    list-style-type: decimal;
    }

.brd .entry-content ol p,
.brd .entry-content ul p {
    padding: 0;
    }

.brd .entry-content ol.alpha {
    list-style-type: upper-alpha;
    }

.brd .entry-content h5, .brd .entry-content h5 * {
    font-weight: bold;
    font-size: 1.084em;
    padding: 0.5em 0;
    }

.brd .entry-content img {
    vertical-align: text-top;
    }

.brd .entry-content .quotebox,
.brd .entry-content .codebox {
    border-style: solid;
    border-width: 1px;
    margin: 0.75em 1em;
    padding: 1em 0.75em;
    }

.brd .entry-content .codebox code, #brd-debug table .tcl, #brd-debug table .tcr {
    font-family: monospace;
    }

.brd .entry-content blockquote {
    overflow: hidden;
    width: 100%;
    }

.brd .entry-content .quotebox cite {
    display: block;
    font-style: normal;
    font-weight: bold;
    }

.brd .entry-content pre {
    margin: 0;
    max-height: 35em;
    min-height: 2em;
    overflow: auto;
    padding: 0 2% 0.1em 0;
    width: 98%;
    }

.brd .entry-content img {
    max-width: 100%;
    }

.brd .entry-content span.bbu {
    text-decoration: underline;
    }

.brd .entry-content br, .brd .sig-demo br, .brd .user-box br, .brd .main-message br {
    display: inline;
    }

.brd .sig-content {
    padding-top: 1em;
    }

.brd span.sig-line {
    display: block;
    width: 200px;
    border-top-style: solid;
    border-top-width: 1px;
    padding-bottom: 0.5em;
    }


/*************************************************************
H - MAIN TABLES
**************************************************************/

/* Table Cells Widths and Alignment
-------------------------------------------------------------*/

.brd table {
    width: 100%;
    table-layout: fixed;
    empty-cells: show;
    border-spacing: 0;
    line-height: 1.3333em;
    }

.brd td {
    overflow: hidden;
    vertical-align: middle;
    }

#brd-userlist table .tc0 {
    width: 30%
    }

#brd-userlist table .tc1 {
    width: 20%;
    text-align: left;
    }

#brd-userlist table .tc2 {
    width: 10%;
    text-align: center;
    }

#brd-debug  table .tc1 {
    white-space: normal;
    width: 10%;
    }

#brd-debug table .tcr {
    white-space: normal;
    width: 90%;
    }

#brd-admin-uresults table .tc0,
#brd-admin-iresults table .tc0 {
    width: 45%;
    }

#brd-admin-uresults table .tc1,
#brd-admin-iresults table .tc1,
#brd-admin-iresults table .tc2 {
    width: 20%;
    }

#brd-admin-uresults table .tc2,
#brd-admin-uresults table .tc4 {
    width: 10%;
    text-align: center;
    }

#brd-admin-uresults .tc3 {
    width: 15%;
    }

#brd-admin-uresults td.tc0 span,
#brd-admin-uresults td.tc3 span {
    display: block;
    white-space: nowrap;
    }

#brd-admin-uresults td.tc0 a,
#brd-admin-uresults td.tc3 a {
    font-weight: bold;
    }

#brd-admin-iresults table .tc0 {
    width: 25%;
    }

#brd-admin-iresults table .tc1 {
    width: 25%;
    }

#brd-admin-iresults table .tc2 {
    width: 20%;
    }

#brd-admin-iresults .tc3 {
    width: 30%;
    }


/* Table Cell Styling
-------------------------------------------------------------*/

.brd .main-content th {
    font-size: 1.084em;
    padding: 0.462em 1.417em;
    font-weight: normal;
    }

.brd table td {
    padding: 0.5em 1.417em;
    border-width: 1px;
    border-style: solid none none solid;
    }

.brd table td.tc0 {
    border-left-style: none;
    border-left-width: 0
    }

.brd table th {
    padding: 0.5em 1.3em;
    border-style: none;
    }

.brd table td.actions, .brd table th.actions {
    text-align: right;
    }

.brd table td.actions span {
    display: block;
    }


/*************************************************************
H - MAIN CONTENT - ODDMENTS
**************************************************************/

/* Reports
-------------------------------------------------------------*/

.brd .report {
    margin-left: 4em;
    }

.brd .report h3 span {
    display: block;
    font-style: normal;
    }

.brd .report h3 cite {
    font-style: normal;
    font-size: 1.084em;
    font-weight: bold;
    }

.brd .report h3 strong {
    position: absolute;
    left: -3.1em;
    width: 1.5em;
    text-align: right;
    font-size: 1.167em;
    }

.brd .report p strong {
    display: block;
    font-weight: normal;
    }

.brd .report h4 {
    border-bottom-style: solid;
    border-bottom-width: 1px;
    }

#brd-admin-reports .frm-buttons {
    margin-left: 4em;
    margin-top: 0;
    }

.brd .report .item-select {
    position: absolute;
    top: 0;
    right: 0.75em;
    height: 2.5em;
    }

/* Help File
-------------------------------------------------------------*/

.brd .help-box samp {
    display: block;
    margin-left: 1.5em;
    }

.brd .help-box h5 samp {
    margin-left: 1.417em;
    }

.brd .help-box code {
    font-family: courier;
    font-size: 1.084em;
    }

.brd .help-box .entry-content {
    padding: 0;
    }

.brd .help-box .hn {
    padding-bottom: 0.5em;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    margin-bottom: 0.5em;
    color: #294F6E
    }
MyFootballCafe.com  is Now Online!
  • Registered: 2006-07-31
  • Posts: 254

Re: [request] left column with custom content (£30 Paypal offered)

answered via email

my mind is on a permanent tangent
byUsers forum
  • Registered: 2007-03-25
  • Posts: 960

Re: [request] left column with custom content (£30 Paypal offered)

replied.

MyFootballCafe.com  is Now Online!
  • Registered: 2008-11-16
  • Posts: 528

Re: [request] left column with custom content (£30 Paypal offered)

If you get a working solution please copy & paste the code and changes to files.
Sounds like we're making progress smile

24 Reply by esupergood (edited by esupergood 2009-05-09 16:20)

  • Registered: 2008-11-16
  • Posts: 528

Re: [request] left column with custom content (£30 Paypal offered)

I changed the min-width and width values to 80% to make room for the right sidebar but nothing changed when I saved the changes.

update:
ignore above i was looking at wrong forum smile

  • Registered: 2008-11-16
  • Posts: 528

Re: [request] left column with custom content (£30 Paypal offered)

I've set the main forum to be 80% wide and the sidebar to be %17 but there is a problem.
Here is a screengrab posted by one of my users using firefox. (It looks fine on mine)

http://www.postimage.org/aV1dX5xJ-f2d7006b74c101b16b9745d9045bec75.jpg

Here is the css:

.brd {
    padding: 0.5em 1em;
    margin: 0 250 0 0;
    max-width: 1100px;
    min-width: 80%;
    width: 80%;
    }

and

#sidebar {
float:right;
width:17%;
}

and this is in my main.tpl file

<div id="sidebar">
sidebar content here
</div>