This should be an easy one ... but I'm having trouble finding the answer:

 

I can work out how to define a new style for headers eg <h1> </h1> but as they are headers they add a couple of <br /> automatically.

 

I have tried to define other variables eg <S1></S1> in the style sheet. They display ok in mozilla but not in explorer. Are there a set of pre defined text options that I can change like the header (<h1>) ones in the style sheet?

 

in my style sheet, this does not display <S1></S1> text correctly:

 

S1 {

font-family: Arial, Helvetica, sans-serif;

font-weight: bold;

font-size: 14px;

color: #EF047E;

}

you can't just make up html tags you have to use existing ones so if you want to use different heading you would use h2, h3, h4, h5. if you wanted to make different styles for a lot of text then you would use a class like this

 

Css:

 

.S1 {
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 14px;
color: #EF047E;
}

 

HTML:

 

<p class="S1">

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam eget nunc nec dui dapibus lacinia. Etiam malesuada, orci sed rutrum iaculis, sem erat hendrerit justo, ut congue nibh purus quis arcu. Morbi sapien mauris, suscipit vitae, aliquam in, porttitor condimentum, nibh. Phasellus varius faucibus purus. Maecenas nec est eu pede tristique ullamcorper. Donec lorem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent purus orci, egestas vel, varius a, condimentum id, felis. Duis tincidunt leo vel justo. Sed a est nec libero gravida euismod. Vestibulum pulvinar, nulla sed fringilla tempus, purus pede tempor dui, id ullamcorper tortor nulla nec libero. Nulla varius rutrum arcu. Phasellus ut lectus id sapien ultricies sodales. Praesent urna. Aenean suscipit justo. Donec tortor sem, cursus vitae, scelerisque a, venenatis at, ipsum.

 

</p>

[/code]

 

or if is two h1 tags you set classes for them and do this

 

<h1 class="S1"></h1>

<h1 class="S2"></h1>

Dizi is right... just ignore the

 tags and the example is perfect.

I can work out how to define a new style for headers eg <h1> </h1> but as they are headers they add a couple of <br /> automatically.

The headers are in-fact putting a bottom margin underneath themselves rather than line-breaks (<br>). If you just want to remove the space under the <h1> tags then you could try something like this…

 

h1 { margin-bottom: 0; }

Both those tricks work well.

 

I did not realise the dot (.) infront of the style defines it as one you made up.

 

to get rid of the paragraph break i replaced <p class="S1"></p>

with <font class="S1"></font>.

 

Now works a treat ...

 

Thanks again

Lol Noooo!!! Don't do that

 

Same trick as rob explained before <p> is not inserting any sort of break, but a margin beneath it.

 

The <font> tag is depreciated (being phased out) so you really should try not to use it. Use the <p> tag as it is semantically correct and change the margins again

It might be beneficial for you to read this.

Thanks for the tips ... I'll go through and remove the font tags

 

Thanks again

I'm still struggling to get this to work with the <p> tags. I want the text to look like:

 

LOGOUT ADMIN

 

It looks like this when I use font tags:

 

echo '<a href="logout.php"><font class="s2"> LOGOUT</font ></a>';

echo '<a href="loggedin.php"> <font class="s2">      ADMIN </font></a>';

 

 

But when I use the <p> tags it looks like this:

 

echo '<a href="logout.php"><p class="s2a"> LOGOUT</p></a>';

echo '<a href="loggedin.php"><p class="s2a">      ADMIN</p></a>';

 

LOGOUT

 

ADMIN

 

The style sheet looks like this:

 

.s2 {

font-family: Arial, Helvetica, sans-serif;

font-weight: bold;

font-size: 16px;

color: #EF047E;

margin-bottom: 0;

}

 

Thanks for any advice ...

put it in the a like this

 

<a href="logout.php" class="s2a"> LOGOUT</a>

 

 

so that the class is held in the link tag rather than adding a <p>

Thanks for these information.