Div code help

darkvallena · 10-03-2012, 09:52 PM

Hello again, I have another issue.

For my post: http://www.madeinregio.com/2012/10/0...to-recruiting/

password: sebastian

The coding used here is:

<img src="http://www.madeinregio.com/wp-content/uploads/2012/10/steph111.png" alt="" title="" width="900" height="567" class="alignnone size-full wp-image-2001" />
<div style="position: relative; top: -547px; left: 45px; width: 1000px; z-index: 2">
<h1><font size="6">Ride for the fall&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp; Sebastian 3<sup>rd</sup> floor, Stephon 4<sup>th</sup> floor
</h1></div></font>

and it works perfectly on Google Chrome:

but Safari and Firefox both show this:

I want Safari and Firefox to show it the same way as Google Chrome. Hopefully someone can help me with this. The CSS could possibly be the issue. or possbily the &ensp; code doesnt work well with the other browsers.

jamaks · 10-03-2012, 10:56 PM

Hi, looks like you intended using

Code:

&nbsp;

rather than

Code:

&ensp;

Stands for No Breaking SPace. Jim

darkvallena · 10-04-2012, 03:38 PM

Once creates space on a line, when makes space between lines?

Is it not right to use it?

jamaks · 10-04-2012, 04:18 PM

Hi, not a good idea to use it repeatedly. To change the spacing between lines add a line height within you CSS style. Since you are using inline styling I would suggest using a style block along the lines of

Code:

<style type="text/css">
h1{font-size:24px;line-height:32px;}
</style>

Adjust these figures to suit your preference, and any other styles you wish to adopt would be palaced within the same style holder. The reason for giving the h1 header a px size is that different browsers display a header at a different size according to their own inbuilt stylesheet and giving a fixed value should have it display the same size in all browsers.
On the subject of getting the space right between the text you may wish to try a transparent image sized to fit and use

Code:

<h1>Ride for the fall<img src="path-of-image/image.gif" width="300" height="20" alt="spacer">Sebastian 3<sup>rd</sup> floor, Stephon 4<sup>th</sup> floor</h1>

Hope this gives you some ideas. Jim