Code addition..

[Rosefriend]

Lovely pawl - I think you are right - see you later..

RF

[Rosefriend]

Hi pawl - so this is what we have if we are going to do single, but able to add more version..

<div class="container" style="margin: 0 auto 10px; width: 300px;">
<div class="title-bar" style="text-align: center;">
<h2>"January 2013 Winner"</h2>
</div>
<div style="height: 300px;">
<img alt="January 2013" src="http://i47.tinypic.com/23kdftz.jpg." height="300" width="300" />
</div>
<div class="title-bar-bottom" style="text-align: center;"><h2>Jasmine</h2></div>
</div>

+++++++++++

Also two additions to the Style sheet...

So what do I do now ?

RF

[Rosefriend]

When you have the time and energy pawl ??

RF

[pawl]

Okay, so the divs refused to sit next to each other, which was somewhat annoying. Cheated in the end, and went for divs in a table. >_<

<div align="center"><table width="918px" margin="0" border="0" padding="0">
<tr>


<td>

<div class="container" style="margin: 0 3px 0 3px; width: 300px;">
<div class="title-bar" style="text-align: center;">
<h2>"January 2013 Winner"</h2>
</div>
<div style="height: 300px;">
<img alt="January 2013" src="http://i47.tinypic.com/23kdftz.jpg." height="300" width="300" />
</div>
<div class="title-bar-bottom" style="text-align: center;"><h2>Jasmine</h2></div>
</div>

</td>

<td>

<div class="container" style="margin: 0 3px 0 3px; width: 300px;">
<div class="title-bar" style="text-align: center;">
<h2>"January 2013 Winner"</h2>
</div>
<div style="height: 300px;">
<img alt="January 2013" src="http://i47.tinypic.com/23kdftz.jpg." height="300" width="300" />
</div>
<div class="title-bar-bottom" style="text-align: center;"><h2>Jasmine</h2></div>
</div>

</td>

<td>

<div class="container" style="margin: 0 3px 0 3px; width: 300px;">
<div class="title-bar" style="text-align: center;">
<h2>"January 2013 Winner"</h2>
</div>
<div style="height: 300px;">
<img alt="January 2013" src="http://i47.tinypic.com/23kdftz.jpg." height="300" width="300" />
</div>
<div class="title-bar-bottom" style="text-align: center;"><h2>Jasmine</h2></div>
</div>

</td>


</tr>
</table></div>


I think you can probably see how this is broken up. =]

[Rosefriend]

I am really happy pawl and I can use 1/2 or 3 as needed....well done!!

Just one point...on the single pic there is a gap between the pic and the board...



but on the 3 pics there isn't...



Is it possible to do that??

RF

[pawl]

Add <br /> between the </table> and </div> and that should sort you out.
It's a slightly messy fix (the table included), but it'll work. For some reason I couldn't get the divs to sit side by side, even after a quick Google search. I blame a broken body-clock, haha.

[Rosefriend]

Well pawl - even with a possible broken body clock I think it is a great job and just what I wanted...haha!!

Many thanks Paul

RF

[Rosefriend]

pawl - I need two pics at the moment so changed the code accordingly and it worked perfectly on the test board...



However when I put it on the real board it doesn't work....



What have I done wrong as the code is exactly the same in both cases...

<div align="center"><table width="612px" margin="0" border="0" padding="0">
<tr>


<td>

<div class="container" style="margin: 0 2px 0 2px; width: 300px;">
<div class="title-bar" style="text-align: center;">
<h2>"December 2012/13 POTM Winner"</h2>
</div>
<div style="height: 300px;">
<img alt="January 2013" src="http://i46.tinypic.com/kdsv3k.jpg." height="300" width="300" />
</div>
<div class="title-bar-bottom" style="text-align: center;"><h2>Jasmine</h2></div>
</div>

</td>

<td>

<div class="container" style="margin: 0 2px 0 2px; width: 300px;">
<div class="title-bar" style="text-align: center;">
<h2>"January 2013 POTM Winner"</h2>
</div>
<div style="height: 300px;">
<img alt="January 2013" src="http://i47.tinypic.com/23kdftz.jpg." height="300" width="300" />
</div>
<div class="title-bar-bottom" style="text-align: center;"><h2>Jasmine</h2></div>
</div>

</td>

</tr>
</table><br /></div>

[pawl]

Looks to me like the text size on the test board is slightly smaller, which is stopping the title from taking up two lines. Any chance you could check the bits you added to the CSS? =]

[Rosefriend]

Damn - yes it is the text size on the real board...it is bigger as the members wanted it pawl, sorry...

I have got different ones for sub-boards, quick reply etc but overall is:

For overall -  text size, colours and styles > text styles > default forum text

Changed it to Tahoma 12

++++++

If I shorted the first title it should work then without messing about??

RF

[pawl]

It's the <h2> text size that's the problem, not the regular text size. Changing that, or the length of the title would work, yeah. =]

[Rosefriend]

Worked well pawl , just changed the title - thanks a lot!!!!! Have made a note to myself for the future..

Thanks again!!

RF