kader om forum

Hulp nodig bij een stijl? Voor zowel XHTML/CSS als grafische vragen uiteraard gerelateerd aan phpBB3.
Forumregels

LEES: Richtlijnen voor Support. Vul de support template in!phpBB3.0.x
Verschaf iemand geen servertoegang tenzij het niet anders kan. Maak altijd eerst een volledige backup en verander de inloggevens na afloop. Eigen risico.
Plaats reactie
Gebruikersavatar
odil
Berichten: 710
Lid geworden op: 26 jan 2009, 19:23
Locatie: belgië
Contacteer:
Contacteer odil

kader om forum

Bericht door odil » 03 mei 2009, 05:37

Hoi,

Ik heb mijn forum versmalt maar hoe krijg ik een kader (border) rond het forum?

Mijn forum : http://www.hond-en-baas.be/forum


Hier op het forum van fridge zie je het voorbeeld van het kader http://www.zonnigforum.nl/index.php


Nog een vraag :
Hoe verander ik de witte achtergrond dat buiten het kader valt.
Alles wat binnen het kader is zou wit moeten blijven.
Omhoog
Gebruikersavatar
Fridge
Berichten: 1028
Lid geworden op: 25 sep 2006, 19:22
Locatie: Rotterdam
Contacteer:
Contacteer Fridge

Re: kader om forum

Bericht door Fridge » 03 mei 2009, 10:23

Zal even plakken wat ik ooit op phpbb.com had geplaatst.....
Fridge schreef:Download the corners image.....

Code: Selecteer alles

http://home.tiscali.nl/developerscorner/liquidcorners/images/corners1280x18.gif
Add to the end of Colours.css

Code: Selecteer alles

.top-left, .top-right, .bottom-left, .bottom-right {
	background-image: url("{T_THEME_PATH}/images/corners1280x18.gif"); /* CHANGE: path and name of your image */
    height: 9px;       /* CHANGE: replace by the height of one of your corners (= 1/2 height of the image) */
    font-size: 2px;    /* DNC: correction IE for height of the <div>'s */
}
.top-left, .bottom-left {
    margin-right: 9px; /* CHANGE: replace by the width of one of your corners */
}
.top-right, .bottom-right {
    margin-left: 9px;  /* CHANGE: replace by the width of one of your corners */
    margin-top: -9px;  /* CHANGE: replace by the height of one of your corners */
}
.top-right {
    background-position: 100% 0;    /* DNC: position right corner at right side, no vertical changes */
}
.bottom-left  {
    background-position: 0 -9px;    /* CHANGE: replace second number by negative height of one of your corners */
}
.bottom-right {
    background-position: 100% -9px; /* CHANGE: replace second number by negative height of one of your corners */
}
.inside {
    border-left: 1px solid #000000; /* YCC: color & properties of the left-borderline */
    border-right: 1px solid #000000;/* YCC: color & properties of the right-borderline */
    background: #FFFFFF;            /* YCC: background-color of the inside */
    color: #000000;                 /* YCC: default text-color of the inside */
    padding-left: 0px;             /* YCC: all texts at some distance of the left border */
    padding-right: 0px;             /* YCC: all texts at some distance of the right border */
}
.notopgap    { margin-top: 0; }    /* DNC: to avoid splitting of the box */
.nobottomgap { margin-bottom: 0; } /* DNC: to avoid splitting of the box */

.outside {
   margin: 0 auto;
   width : 850px;
}
Change in tweaks.css
Find...

Code: Selecteer alles

* html #search-box {
   margin-right: 35px;
}
Replace with...

Code: Selecteer alles

* html #search-box {
   margin-right: 60px;
}
In overall_header.html

Find...

Code: Selecteer alles

<body
After add...

Code: Selecteer alles

<div class="outside">
<div class="top-left"></div><div class="top-right"></div>
<div class="inside">
<div class="notopgap">
In overall_footer.html

Find...

Code: Selecteer alles

</body>
Before add...

Code: Selecteer alles

</div>
<div class="nobottomgap"></div>
</div>
<div class="bottom-left"></div><div class="bottom-right">
</div>
</div>
Niet alles is helemaal up-to-date, je kunt bijv ook de css die je aan colours toevoegt ook in een aparte file zetten en vervolgens importeren in je stylesheet css
De aanpassing in tweaks.css is volgens mij ook niet meer noodzakelijk.
De afbeelding kan je ook aanpassen met een foto bewerkings programma.

Let wel....als je dit wilt doen moet je de huidige versmalling van je forum ongedaan maken.

Mocht je hulp nodig hebben kan je me pm'men, moet straks toch werken en heb ik alle tijd om te prutsen :D
Omhoog
Gebruikersavatar
odil
Berichten: 710
Lid geworden op: 26 jan 2009, 19:23
Locatie: belgië
Contacteer:
Contacteer odil

Re: kader om forum

Bericht door odil » 03 mei 2009, 11:25

voor mij is dit chinees, ik zal het verbrodden dat weet ik al op voorhand.


Ik begin om 17u met mijn werk en heb dan ook meer tijd, ja de beveiliging hé druk druk druk :mrgreen:
Laatst gewijzigd door Paul op 03 mei 2009, 11:49, 1 keer totaal gewijzigd.
Reden: Onnodige hoofdpijn kleur verwijderd, graag niet doen.
Omhoog
Gebruikersavatar
odil
Berichten: 710
Lid geworden op: 26 jan 2009, 19:23
Locatie: belgië
Contacteer:
Contacteer odil

Re: kader om forum

Bericht door odil » 03 mei 2009, 15:32

Ik moet helaas dubbelposten want bewerken gaat niet, ik krijg deze melding

Dit bericht is gesloten. Je kan niet langer dit bericht bewerken.

Ik heb dus alles zelf geprobeert en het is me gelukt, had ik niet gedacht van mezelf want ik kan geen engels.

Nu zie ik alles zoals het moet zijn een mooie zwarte border rond het smalle forum met ronde hoeken.
Maar een lid van mijn forum zegt dat hij links en rechts zwarte lijnen ziet en boven en onder rode lijnen.

Kunnen jullie een meedelen wat jullie zien? http://www.hond-en-baas.be/forum
Omhoog
Gebruikersavatar
Fridge
Berichten: 1028
Lid geworden op: 25 sep 2006, 19:22
Locatie: Rotterdam
Contacteer:
Contacteer Fridge

Re: kader om forum

Bericht door Fridge » 03 mei 2009, 15:41

Ziet er op zich goed uit, alleen de binnenkant kleur van corners1280x18.gif is nu niet goed, deze heeft wel een witte binnenkant...

Code: Selecteer alles

http://www.dumpspace.nl/images/corners1280x18.gif
Edit: mijn forum is iets breder, ik heb de 850 gewijzigd in 950px

je moet nog wel 2 andere aanpassingen maken want je hebt nu dit probleem nog...

Afbeelding

En dat moet veranderen in....

Afbeelding

In content.css

Code: Selecteer alles

ul.topiclist dt {
   display: block;
   float: left;
   width: 50%;
   font-size: 1.1em;
   padding-left: 5px;
   padding-right: 5px;
}
Verander 50% -> 40%

en..

Code: Selecteer alles

dd.posts, dd.topics, dd.views {
	width: 8%;
	text-align: center;
	line-height: 2.2em;
	font-size: 1.2em;
}
Verander 8% -> 10%

Edit 2: Als je vind dat je image logo te dicht op de buitenrand staat dan is dat aan te passen door een aanpassing te doen in het toegevoegde stukje css.
Zoek naar

Code: Selecteer alles

    padding-left: 0px;             /* YCC: all texts at some distance of the left border */
Plaats daarvoor op een nieuwe regel

Code: Selecteer alles

    padding-top: 10px;
Omhoog
Gebruikersavatar
Pascal
Berichten: 2315
Lid geworden op: 20 feb 2007, 18:55
Locatie: Nijmegen
Contacteer:
Contacteer Pascal

Re: kader om forum

Bericht door Pascal » 03 mei 2009, 17:09

Odil, je menu die je eerst had is weg :O :o
Keep bleeding, keep, keep bleeding love
I keep bleeding, I keep, keep bleeding love
Keep bleeding, keep, keep bleeding love
You cut me open
Omhoog
Gebruikersavatar
odil
Berichten: 710
Lid geworden op: 26 jan 2009, 19:23
Locatie: belgië
Contacteer:
Contacteer odil

Re: kader om forum

Bericht door odil » 03 mei 2009, 18:22

Ja pascal je hebt het al gezien :o
Ik heb heen rekening gehouden met het script van het menu, maar ik heb wel een backup van de bestanden en waarschijnlijk is het niet moeilijk om die code eruit te halen of vergis ik me?

Fridge,

Inderdaad je ziet een andere kleur tuseen de bovenste border en de header maar ik kon het probleem niet vinden, dus bedankt voor de melding, ik zal het aanpassen met photoshop.

Waar verander ik die breedte want ik zou het ook iets breder willen, nu is het iets te smal.
Omhoog
Gebruikersavatar
Fridge
Berichten: 1028
Lid geworden op: 25 sep 2006, 19:22
Locatie: Rotterdam
Contacteer:
Contacteer Fridge

Re: kader om forum

Bericht door Fridge » 03 mei 2009, 18:27

De breedte verander je in het stukje css wat je toevoegd, het exacte stukje is..

Code: Selecteer alles

.outside {
   margin: 0 auto;
   width : 850px;
}
en daarin verander je 850px in 950px

je kan overigens je huidige corners1280x18.gif overschrijven met deze...

Code: Selecteer alles

http://www.dumpspace.nl/images/corners1280x18.gif
Omhoog
Gebruikersavatar
odil
Berichten: 710
Lid geworden op: 26 jan 2009, 19:23
Locatie: belgië
Contacteer:
Contacteer odil

Re: kader om forum

Bericht door odil » 03 mei 2009, 18:45

#wrap {
padding: 0 20px;
min-width: 650px;
.outside {
margin: 0 auto;
width : 950px;

zo dus?
maar ik zie geen verschil in breedte?


Over het logo, weet jij hoe ik die over de ganse breedte kan maken?
Ik zou graag de header uit 1 groot logo willen hebben.
Omhoog
Gebruikersavatar
Fridge
Berichten: 1028
Lid geworden op: 25 sep 2006, 19:22
Locatie: Rotterdam
Contacteer:
Contacteer Fridge

Re: kader om forum

Bericht door Fridge » 03 mei 2009, 19:04

Je gaat nu wel hele rare dingen doen odil :D
Je gaat nu dingen aanpassen in common.css en dat is niet de bedoeling, de verandering die je moet maken is in het stukje css wat je hebt toegevoegd aan colours.css, daarin staat (als je het eerder daar hebt toegevoegd)

Code: Selecteer alles

.outside {
   margin: 0 auto;
   width : 850px;
}
En daarin verander je de 850px in 950px

Voeg me anders even toe in msn (mocht je het hebben), account staat in mijn profiel.
Omhoog
Gebruikersavatar
odil
Berichten: 710
Lid geworden op: 26 jan 2009, 19:23
Locatie: belgië
Contacteer:
Contacteer odil

Re: kader om forum

Bericht door odil » 04 mei 2009, 04:54

We zijn verder gegaan op msn.
Bij deze alvast mijn grote en oprechte dank aan fridge om een wildvreemd persoon zo goed te helpen.

Dank u.
Omhoog
Plaats reactie

Terug naar “3.0 Stijlen”