• Registered: 2007-01-11
  • Posts: 10

Topic: where shall i place my own CSS code?

what I am wondering is where i should place my own CSS code, because when i puts a tag for it in main.tpl, the forums CSS doesnt work?

link to my page: http://mikand14.100webspace.net/PunBB/h … tpage.html

click on the forum menu on the left side smile

  • Smartys
  • Former PunBB Developer
  • Offline
  • Registered: 2004-04-30
  • Posts: 7,844

Re: where shall i place my own CSS code?

The problem (I think) is that you're putting it within infobox, which has all kinds of CSS set that contradicts the settings for PunBB.

  • Registered: 2007-01-11
  • Posts: 10

Re: where shall i place my own CSS code?

it helped a little... now the tags  <pun_navlinks><pun_status> shows correctly, but the forum still look strange, the three other parts doesnt look right... i tried to remove my  CSS but it didnt make it better... :S

4 Reply by Haesil (edited by Haesil 2007-01-12 14:30)

  • Registered: 2007-01-11
  • Posts: 10

Re: where shall i place my own CSS code?

here's my CSS if that can help

 /* CSS Document */

body{background: #2A2A2A;}

/* layout CSS */

#layout
{
border: 0px; 
width: 800px;
margin: 0 auto;
vertical-align: middle;
background-color: #2A2A2A;
}

/* slut för layout CSS */

/* header CSS */
#header
{
width: 800px;
height: 125px;
margin: 0 auto;
margin-bottom: 20px;
background-image: url(header.jpg); 
background-repeat: no-repeat;
}

/* slut för header CSS */

/* infobox CSS */
#infobox
{
font: 12px Verdana, Arial, Helvetica, sans-serif;
margin: 0px;
padding: 0px;
}

#infobox ul
{
list-style-type: none;
margin: 0px;
padding: 0px;
}

#infobox h6.inforubrik
{
margin: 0px;
margin-left: 174px;
padding: 5px 10px;
background-color: #606060;
color: #60A0DC;
font-size: 12px;
text-align: center;
}

#infobox li
{
display: block;
height: 100%;
padding: 5px 10px;
border-top: 1px solid #606060;
border-right: 1px solid #606060;
border-bottom: 1px solid #606060;
border-left: 1px solid #606060;
background-color: #383838;
color: #D4D4D4;
text-decoration: none;
}

/* meny CSS */

#menybox
{
width: 150px;
border: 2px solid;
border-color: #606060 #606060 #606060 #606060;
margin: 0;
padding: 0;
margin-right: 20px;
font: 12px Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
float: left;
}

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

#menybox a, #menybox span
{
display: block;
height: 100%;
padding: 5px 10px;
border-top: 1px solid #606060;
border-right: 1px solid #606060;
border-bottom: 1px solid #606060;
border-left: 1px solid #606060;
background-color: #565656;
color: #60A0DC;
text-decoration: none;
}

#menybox a:hover, #menybox span#aktuell
{
background-color: #424242;
color: #80D6FF;
}

#menybox h6.menyrubrik
{
margin: 0;
padding: 5px 10px;
background-color: #606060;
color: #60A0DC;
font-size: 12px;
text-align: center;
}

/* slut på menyn CSS */
  • Registered: 2004-05-24
  • Posts: 449

Re: where shall i place my own CSS code?

Can't you just link your CSS from a default stylesheet?

Just like Oxygen.css calls Oxygen_cs.css and base.css.

  • Registered: 2007-01-11
  • Posts: 10

Re: where shall i place my own CSS code?

i did that now but the forum still looks wrong... :S

  • Registered: 2004-05-24
  • Posts: 449

Re: where shall i place my own CSS code?

Have you made the include in the last line of your color scheme? (*_cs.css file).
If not your instruction might have been overridden.

  • Registered: 2007-01-11
  • Posts: 10

Re: where shall i place my own CSS code?

Strofanto wrote:

Have you made the include in the last line of your color scheme? (*_cs.css file).
If not your instruction might have been overridden.

what include?!

  • Registered: 2004-05-24
  • Posts: 449

Re: where shall i place my own CSS code?

I meant Import, sorry

Add this at the end of your color scheme css

@import url(your_css.css);

10 Reply by Haesil

  • Registered: 2007-01-11
  • Posts: 10

Re: where shall i place my own CSS code?

i have added 

@import url(imports/minstilmall_cs.css);

in the cobalt.css after the two other imports, shall i add it somewhere else toò?

  • Registered: 2004-05-24
  • Posts: 449

Re: where shall i place my own CSS code?

Remove that string from there.
Add 

@import url(minstilmall_cs.css);

at the end of cobalt_css.cs

12 Reply by Haesil

  • Registered: 2007-01-11
  • Posts: 10

Re: where shall i place my own CSS code?

didnt solve it(if i did right) just made my meny look strange too..

  • Registered: 2004-05-24
  • Posts: 449

Re: where shall i place my own CSS code?

You did right and I know have no idea why it doesn't work. Did you put the original *.tpl back?

14 Reply by Haesil (edited by Haesil 2007-01-12 16:15)

  • Registered: 2007-01-11
  • Posts: 10

Re: where shall i place my own CSS code?

yes, if i put the main.tpl back it works as normal... nothing wrong on the forum..

so it have to be something wrong on my code?!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html dir="<pun_content_direction> ">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=<pun_char_encoding> " />
    <pun_head>

  </head>
  <body>
    <div id="layout">
      <div id="header">
      </div>
      <div id="menybox">
        <h6 class="menyrubrik" title="Navigerings Meny"> Meny
        </h6>
        <ul>
          <li>
          <a href="hemsida/firstpage.html" title="Nyheter">Nyheter</a></li>
          <li>
          <span id="aktuell" title="Vårat Forum"> Forum
          </span></li>
          <li>
          <a href="hemsida/download.html" title="">Download</a></li>
          <li>
          <a href="hemsida/lankar.html" title="Några länkar till några hemsidor">Länkar</a></li>
          <li>
          <a href="#" title="Beskrivning 5">jadu</a></li>
        </ul>
      </div>
        <table border="0">
          <tr>
            <td></td>
            <td>
              <div id="punwrap">
                <div id="pun<pun_page>" class="pun">
                  <div id="brdheader" class="block">
                    <div class="box">

                      <pun_navlinks>
                        <pun_status>
                    </div>
                  </div>
                </div>
              </div>
              <pun_announcement>
                <pun_main>
                  <pun_footer></td>
          </tr>
        </table>
      </div>

  </body>
</html>

thats my edited main.tpl

can someoen see anything wrong in that?

  • Registered: 2004-05-24
  • Posts: 449

Re: where shall i place my own CSS code?

Try this as main.tpl

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html dir="<pun_content_direction>">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<pun_char_encoding>" />
<pun_head>
</head>
<body>

<div id="menybox" style="float: left; width: 140px;" class="block">
    <h6 class="menyrubrik" title="Navigerings Meny">Meny</h6>
    <ul>
    <li><a href="hemsida/firstpage.html" title="Nyheter">Nyheter</a></li>
    <li><span id="aktuell" title="Vårat Forum">Forum</span></li>
    <li><a href="hemsida/download.html" title="">Download</a></li>
    <li><a href="hemsida/lankar.html" title="Några länkar till några hemsidor">Länkar</a></li>
    <li><a href="#" title="Beskrivning 5">jadu</a></li>
    </ul>
</div>

<div id="punwrap" style="margin-left: 150px;" class="block">
<div id="pun<pun_page>" class="pun">

<div id="brdheader" class="block">
    <div class="box">
        <div id="brdtitle" class="inbox">
            <pun_title>
            <pun_desc>
        </div>
        <pun_navlinks>
        <pun_status>
    </div>
</div>

<pun_announcement>

<pun_main>

<pun_footer>

</div>
</div>
</body>
</html>

16 Reply by Haesil

  • Registered: 2007-01-11
  • Posts: 10

Re: where shall i place my own CSS code?

found the problem.. had taken away that code in main.tpl bacause i wanted to remove the title my punbb forum and the things under that...

        <div id="brdtitle" class="inbox">
            <pun_title>
            <pun_desc>
        </div>

17 Reply by Haesil

  • Registered: 2007-01-11
  • Posts: 10

Re: where shall i place my own CSS code?

hum... doesnt look like that was the problem, because now i have taken away it but now it works fine :S
strange..