Topic: PunBB Miniportal CSS... HELP!!

well i'm trying to add a column to the left of every page using css and just some extra divs, i want to do it without editing the current css if possible, but i have problems, if i use floats then it messes up the punbb layout because of the clears and if i use absolute positioning it goes over the footer. I might be missing a simple way to do this so if someone could point me in the right direction it would be great

2

Re: PunBB Miniportal CSS... HELP!!

Now you know why I want to get rid of the clears for PunBB 1.3.

The answer is to make sure PunBB comes before the left column in the source because the clears will only clear floats above them in the source code. That means using one of the negative margin solutions.

Re: PunBB Miniportal CSS... HELP!!

Do you have an url to show?

Sorry for my french english.
GT4 Club driver France & Forum - Lingerie.

4

Re: PunBB Miniportal CSS... HELP!!

Does the solution Paul gave help you Connhord?

Ludo,

Re: PunBB Miniportal CSS... HELP!!

i dunno i just spent the entire day helping my sister at maths (being clever sucks) so i haven't had chance to look

6

Re: PunBB Miniportal CSS... HELP!!

I was already hating maths... but if you tell me that maths are anoying you to make the miniportal, well, I hate more and more maths!
wink

Ludo,

Re: PunBB Miniportal CSS... HELP!!

lol, maths is great hmm

8

Re: PunBB Miniportal CSS... HELP!!

Romuald wrote:

Do you have an url to show?

this is a former example. http://66.98.138.31/~connorhd/pundev/index.htm but I think the miniportal should exactly look like this.
This would satisfy me. Maybe the problem is that this version is not compatible with 1.2.4 because it was developped for 1.2 dev

Ludo,

Re: PunBB Miniportal CSS... HELP!!

yeh thats for 1.2 dev but i have actually updated it to 1.2.x, but it uses floats so can't work with the forum

10

Re: PunBB Miniportal CSS... HELP!!

what is float? Is the problem with the index page or with this page http://66.98.138.31/~connorhd/pundev/2col.htm ?
Does 1.2.4 use float that 1.2 dev did not use?

Ludo, wink

Re: PunBB Miniportal CSS... HELP!!

its the way the css is and neither of those pages show the problem you see the problem most on post pages

Re: PunBB Miniportal CSS... HELP!!

Import new CSS (with PHP) and apply
#left {position:absolute}
#main {margin-left:200px}
?
the new CSS overwrite the current style.

Sorry for my french english.
GT4 Club driver France & Forum - Lingerie.

Re: PunBB Miniportal CSS... HELP!!

look i'm ok now paul helped me, if you read my first post thats no good

14 (edited by Ludo 2005-04-03 16:46)

Re: PunBB Miniportal CSS... HELP!!

Connorhd wrote:

its the way the css is and neither of those pages show the problem you see the problem most on post pages

Ok Connhord. So, if I understand good, the problem you have is with post in forum.
So it means for me that the index you have build work without problems. In fact me, and others I suppose, just need an index page and not a second page like this: http://66.98.138.31/~connorhd/pundev/2col.htm
So if the index page you've build works good, which I understand, can you release only this index page?
In fact, what I'm looking for is an index totally independant of the forum (except obviously the board menu...)
Sorry if I misunderstood something...

Ludo,

Re: PunBB Miniportal CSS... HELP!!

3col.css

#container {
    width: 100%;
    float: left;
    margin-right: -200px;
}
#main {
    margin-left: 150px;
    margin-right: 200px;
    padding:0px 10px 0px 10px;
}
#left {
    width: 150px;
    float: left;
}
#sidebar {
    width: 200px;
    float: right;
}
.clearing {
    height: 0;
    clear: both;
}

and heres a page

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

<html dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Dragon Fighter CMS</title>
<link rel="stylesheet" type="text/css" href="style/Oxygen.css" />
<link rel="stylesheet" type="text/css" href="style/imports/3col.css" />
</head>
<body>

<div id="punhcms" class="punwrap">

<div id="brdtitle" class="block">
    <h1><span>My PunBB forum</span></h1>

    <div class="box">
        <div class="inbox">
            <p>Unfortunately no one can be told what PunBB is - you have to see it for yourself.</p>
        </div>
    </div>
</div>

<div id="brdmenu" class="block">
    <div class="box">

        <div class="inbox">

            <ul><li><a href="cms.php">Index</a></li><li><a href="index.php?page=forum">Forum</a></li><li><a href="userlist.php">User list</a></li><li><a href="search.php">Search</a></li><li><a href="register.php">Register</a></li><li><a href="login.php">Login</a></li></ul>
        </div>
    </div>
</div>

<div id="brdwelcome" class="block">
    <div class="box">

        <div class="inbox">
            <p>You are not logged in.</p>
        </div>
</div>
</div>



</div>

<div id="puncms" class="punwrap">
<div id="container">
    <div id="left">    
        <div class="block">
            <h2><span>Menu</span></h2>
            <div class="box">
                <div class="inbox">
                    <p>
                        <a href="index.php?page=forum">Forum</a><br />

                        <a href="dragonfighter.exe">Download</a>
                    </p>
                </div>
            </div>
        </div>
        <div class="block">
            <h2 class="block2"><span>Whos Online?</span></h2>
            <div class="box">

                <div class="inbox">
                    <p>
                        Guests online: 1<br />Users online: Test
                    </p>
                </div>
            </div>
        </div>
    </div>
    <div id="main">

    
        <div class="block">
            <h2><span>Welcome</span></h2>
            <div class="box">
                <div class="inbox">
                    <p>
                        Welcome to the site,    
                    </p>
                </div>
            </div>

        </div>
        <div class="blockform">
            <h2 class="block2"><span>News</span></h2>
            <div class="box">
                <form>
                    <div class="inform">
                        <fieldset>
                            <legend>News Item 1</legend>

                            <div class="infldset">
                                <p>Posted by <a href="#">Nick</a> on <i>date</i></p>
                                <div class="forminfo">    
                                    <p>News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News.</p>
                                </div>
                            </div>

                        </fieldset>
                    </div>
                    <div class="inform">
                        <fieldset>
                            <legend>News Item 2</legend>
                            <div class="infldset">
                                <p>Posted by <a href="#">Nick</a> on <i>date</i></p>

                                <div class="forminfo">    
                                    <p>News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News News.</p>
                                </div>
                            </div>
                        </fieldset>
                    </div>
                </form>
            </div>
        </div>

    </div>    
</div>
<div id="sidebar">
    <div class="blockform">
        <h2><span>Login</span></h2>
        <div class="box">
            <form id="login" method="post" action="login.php?action=in" onsubmit="return process_form(this)">
            <div class="inform">
                <input type="hidden" name="form_sent" value="1" />

                <input type="hidden" name="redirect_url" value="cms.php" />
                <p>
                    <label for="req_username"><strong>Username</strong><br /></label>
                    <input id="req_username" type="text" name="req_username" size="16" maxlength="20" tabindex="1" />
                    <label for="req_password"><strong>Password</strong><br /></label>
                    <input id="req_password" type="password" name="req_password" size="16" maxlength="20" tabindex="2" />
                </p>
                <p>If you have not registered or have forgotten your password click on the appropriate link below.</p>

                <p><a href="register.php" tabindex="4">Not registered yet?</a><br />
                <a href="login.php?action=forget" tabindex="5">Forgotten your password?</a></p>
                <p><input type="submit" name="login" value="Login" tabindex="3" /></p>
            </div>
            </form>
        </div>
    </div>
    <div class="block">

    <h2 class="block2"><span>Latest Forum Posts</span></h2>
        <div class="box">
            <div class="inbox">
                <p>
                    <strong>·</strong> <a href="http://garyschilling.info/punbb12/viewtopic.php?id=3&action=new" title="fdghfg">fdghfg</a><br />
                </p>
            </div>

        </div>
    </div>
</div>
<div class="clearing"> </div>
<br />

<div id="brdfooter" class="block">
    <h2><span>Board footer</span></h2>
    <div class="box">
        <div class="inbox">
            <p class="conr">Powered by <a href="http://punbb.org/">PunBB</a> 1.2 Beta<br />© Copyright 2002-2004 Rickard Andersson</p>

            <div class="clearer"></div>
        </div>
    </div>
</div>

</div>

</body>
</html>

thats the markup for the portal page i did for gary13579

Re: PunBB Miniportal CSS... HELP!!

That was just a little exemple.
But I'm not sur to have understand. Sorry. wink

Sorry for my french english.
GT4 Club driver France & Forum - Lingerie.

17

Re: PunBB Miniportal CSS... HELP!!

Connorhd wrote:

thats the markup for the portal page i did for gary13579

Good work but this only works with former styles...
With news style (1.2.4) this does not work good...
I think I'll wait you find the solution it to work good...

wink

Ludo,

Re: PunBB Miniportal CSS... HELP!!

did you try it with the new styles?

19 (edited by Ludo 2005-04-03 17:51)

Re: PunBB Miniportal CSS... HELP!!

yes I just tried. It does not work good.
It only work with former oxygen.css
See what it gives with 1.2.4 styles: http://www.pluriservices.net/forum/index2.php

Ludo,

Re: PunBB Miniportal CSS... HELP!!

ahh yeh.. well you'll have to wait for the miniportal mod, sorry i'm so lazy hmm

Re: PunBB Miniportal CSS... HELP!!

just to say, thanks Paul negative margin works big_smile

http://punbb.org/forums/viewtopic.php?id=7051 - new miniportal