Page 1 of 2
[opgelost] pad en plaats css van het forum made simple
Posted: Sun Aug 22, 2010 9:53 am
by demaster
Nadat ik het forum had bijgewerkt naar een nieuwere versie 0.9.4 bleek dat het stylesheet mede veranderd was en de layout hierdoor veranderd. Ik had nl. enkele plaatjes gekoppeld. Nu toont het forum de plaatjes (achtergrond opmaak niet meer). Ik denk dat het te maken heeft met de plaats waar nu het forum stylesheet staat. Ik kan het stylesheet van Forum_Made _Simple niet vinden (het staat wel gewoon bij het tabblad stylesheets en dat kan ik bewerken, maar het pad naar de plaatjes, staan bij mij in uploads/images, werkt niet meer. Hier het voorbeeld van het huidige pad.
#forum td.forum_alternate1{ background-image:url(uploads/images/doorzicht.png) }
Ik hoor graag!
Re: pad en plaats css van het forum made simple
Posted: Sun Aug 22, 2010 10:06 am
by compufairy
Hoi,
Kun je een link plaatsen naar de bedoelde site?
Overigens valt het mij op dat er in dat lijntje css code geen ; achter .../doorzicht.png) staat.
Groet,
Anne-Mieke
Re: pad en plaats css van het forum made simple
Posted: Sun Aug 22, 2010 10:43 am
by demaster
Dag Anne-Mieke,
site is
www.ikelpie.com
ik heb ; erachter gezet, maar geen verandering gezien.
Re: pad en plaats css van het forum made simple
Posted: Sun Aug 22, 2010 10:56 am
by compufairy
In de bijlage zie je een screenshot van wat ik zie als ik de site open met de laatste versie van FF. Ik zie daar dat je in de achtergrond van de forum berichten deze image hebt staan:
http://www.ikelpie.com/uploads/images/d ... wittig.png
Ik kan niet beoordelen wat je nu precies mist in deze pagina.
Verder zie ik dat deze css er aan hangt:
/* Start of CMSMS style sheet 'Forum_Made_Simple' */
#forum .forum_title{ font-weight:bold; }
#forum .forum_link{ font-size: 1.0em; }
#forum a.forum_link{ text-decoration:none; }
#forum form textarea{ border:1px inset #eee; font-size:.9em; background-image:url(uploads/images/doorzicht-wittig.png); width:600px; height:200px; }
#forum table.forum_pagetable{ width:100%; margin:4; padding:4; border:0; }
table.forum_pagetable th,td{ padding:4px; }
.forum_head_table{ background-image: url(uploads/images/doorzicht-wittig.png); repeat-x; }
.forum_head_icon{ width:22px; }
.forum_head_name{ width:60%; text-align:left; }
.forum_head_count{ width:14%; text-align:center; }
.forum_head_subject{ width:47%; text-align:left; font-weight:bold}
.forum_head_views{ width:14%; text-align:center; }
.forum_head_info{ width:21%; text-align:center; }
.forum_head_topic{ font-weight:bold; }
.forum_head_reply{ text-align:right; }
.forum_icon{ vertical-align:top; }
.forum_name{ vertical-align:top; font-weight:bold; }
.forum_count{ text-align:center; vertical-align:top; }
.forum_subject{ vertical-align:top; }
.forum_views{ text-align:center; vertical-align:top; }
.forum_info{ width:21%; font-size:.7em; text-align:center; vertical-align:top; }
.forum_content{ width:66%; vertical-align:top; }
.forum_edit{ width:13%; text-align:center; vertical-align:top; }
.forum_bodypost{ width:76%; vertical-align:top; }
#forum td.forum_alternate1{ background-image:url(uploads/images/doorzicht.png); repeat;}
#forum td.forum_alternate2{ background-image:url(uploads/images/doorzicht-wittig.png);repeat; }
.forum_pagination{ font-size:.9em; }
.forum_quote{ padding:0 7px; border:1px solid #000; background-color:#dce; }
.forum_center{ margin:0; padding:0; border:0; text-align:center; }
#forum a.reply_link{ font-size:.8em; text-decoration:none; }
#forum span.reply_link{ font-size:.8em; }
/* End of 'Forum_Made_Simple' */
Leuke site trouwens!
Re: pad en plaats css van het forum made simple
Posted: Sun Aug 22, 2010 11:07 am
by demaster
Dat klopt, dank voor opmerking over de site
handig zo'n overzicht, waar het omgaat is dat bij deze code
#forum td.forum_alternate1{ background-image:url(uploads/images/doorzicht.png); repeat;}
#forum td.forum_alternate2{ background-image:url(uploads/images/doorzicht-wittig.png);repeat; }
er wisselend een licht geel en wit achtergrondbalk onstaat, zodat de vraag en de reactie duidelijker van elkaar te onderscheiden zijn. Ik had er al even ook repeat achter gezet omdat het een heel klein png is die herhaald wordt in de achtergrond.
Toch geeft het die opmaak nog niet, kan het zijn dat het pad niet klopt?
demaster
Re: pad en plaats css van het forum made simple
Posted: Sun Aug 22, 2010 11:58 am
by Acorna078
Als ik je vraag zo lees wil je graag onderscheid maken tussen de even en oneven rijen in de forum tabel.
Bedoel je dit effect?
Re: pad en plaats css van het forum made simple
Posted: Sun Aug 22, 2010 12:03 pm
by compufairy
Lang leve de fantastische functionaliteiten in dit forum
Ik was een reply aan het schrijven om te vertellen dat ik zelf geen CSS whizzkid ben (besteed ik altijd uit) en kreeg bericht dat er intussen een nieuwe reply geplaatst was. Door Acorna078. Volgens mij is dat precies wat je zoekt.
@Acorna078 Hoe krijg je dit effect voor elkaar?
Grote dank alvast,
Anne-Mieke
Re: pad en plaats css van het forum made simple
Posted: Sun Aug 22, 2010 12:18 pm
by Rolf
dat valt wel mee, compufairy... ik kom er vanmiddag nog wel even op terug. nu is dat even wat lastig. grt. rolf.
Re: pad en plaats css van het forum made simple
Posted: Sun Aug 22, 2010 12:25 pm
by demaster
Ja dat bedoelde ik, hoe heb je het voor elkaar gekregen?
Hoor graag,
demaster
Re: pad en plaats css van het forum made simple
Posted: Sun Aug 22, 2010 12:31 pm
by Rolf
google maar eens naar foreach en cycle. Grt. Rolf.
Re: pad en plaats css van het forum made simple
Posted: Sun Aug 22, 2010 12:36 pm
by Acorna078
@compufairy : Gelukkig ben ik bijna dagelijks bezig met CSS. Hoort bij mijn werk...
Een paar opmerkingen vooraf:
1) Ik kom de classes 'forum_alternate1' en 'forum_alternate2' niet tegen in de HTML code van het forum (CTRL+F alternate). Voor een goede werking moeten deze classes worden toegevoegd. Dit is waarschijnlijk een instelling in de Forum template. Er zit dus geen fout in het aanroepen van de afbeeldingen!
2) Voor het 'zebra' effect bij rijen in een tabel, moet de styling op de TR (rij) gezet worden en niet op de TD (tabelcel)
3) De gebruikte CSS syntax is niet correct. Je kan binnen het attribuut 'background-image' geen 'repeat' aanroepen. Dit kan alleen bij het verzamel attribuut 'background'.
#forum td.forum_alternate1{ background-image:url(uploads/images/doorzicht.png); repeat;}
#forum td.forum_alternate2{ background:url(uploads/images/doorzicht-wittig.png) repeat; }
Ik zou eerst even checken of de juiste classes daadwerkelijk worden toegevoegd en dan de volgende CSS code proberen:
Code: Select all
#forum tr.forum_alternate1{ background:url(uploads/images/doorzicht.png) repeat; }
#forum tr.forum_alternate2{ background:url(uploads/images/doorzicht-wittig.png) repeat; }
Voor het maken van de screenshot heb ik gebruik gemaakt van IE Developer Toolbar
Re: pad en plaats css van het forum made simple
Posted: Sun Aug 22, 2010 12:58 pm
by demaster
Dank, heb het veranderd, mij is alleen nog onduidelijk wat ik bij 1) moet toevoegen in het forum template (classes).
demaster
Re: pad en plaats css van het forum made simple
Posted: Sun Aug 22, 2010 1:33 pm
by Rolf
Zo, dit gaat wat gemakkelijker dan met een telefoon... :D
Door het gebruik van de Smarty {Cycle} tag, kun je variabelen wisselen.
In onderstaand geval wordt aan $background wisselend de waarde van background1 en background2 gegeven. Hierdoor krijgt de eerste regel een andere kleur als de tweede regel. Eerst wit en dan grijs, en dan weer wit... enz.
Voorbeeld Sjabloon
Code: Select all
<table>
{foreach from=$items item="item"}
{cycle values="background1,background2" assign="background"}
<tr class="{$background}">
<td>
...
</td>
<td>
...
</td>
</tr>
{/foreach}
</table>
Stylesheet
Code: Select all
.background1 {
background: #fff;
}
.background2 {
background: #ccc;
}
Dit kun je natuurlijk ook toepassen met div's en met meerdere kleuren en andere (CSS) functies.
grt. Rolf
Re: pad en plaats css van het forum made simple
Posted: Sun Aug 22, 2010 2:05 pm
by demaster
Bedankt Rolf,
dit gaat me wat boven m'n pet op dit moment. Ik begrijp de oplossing. Ik ga er wel even op studeren, moet 'm nu nog toepassen in bestaande code.
Kan weer even vooruit,
demaster.
Re: pad en plaats css van het forum made simple
Posted: Sun Aug 22, 2010 2:08 pm
by Rolf
demaster wrote:
dit gaat me wat boven m'n pet op dit moment. Ik begrijp de oplossing. Ik ga er wel even op studeren, moet 'm nu nog toepassen in bestaande code.
Kijk maar even en anders moet je het sjabloon hier even neer zetten...
®
