Safari problem

Hi everyone

I have style up a button using CSS only (referring to it via class=“button”) and inserted it into some forums I am working on. Works great in everything except Safari where it ‘crashes’ into the table below it, rather than appearing above it.

Whaddya reckon. Basically the button is a styled link:

a href=“index.htm” class=“button rightalign”>Post a New Topic >></a

CSS is:

a.button:link {
background-color:#87C7C6;
color:#FFFFFF;
text-decoration:none;
}
.rightalign {
float:right;
}

TIA

Cheers

Del

The element that follows a float is the one that needs the “clear” applied to it. If you add clear:both to the float itself then that will ensure the float clears the elements above itself but does nothing for anything that follows.:slight_smile:

BTW align:right is not css :wink:

clear:both in the table CSS did the trick.

Thanks ever so much Paul - appreciated.

Out of interest, would

.rightalign
align: right
clear: both

work? Or does it have to be in the element following?

Cheers

Del

LOL - thanks Paul - was typing quickly.

Problem sorted and something new learned.

Many thanks

Cheers

Del

Sorry - I hovered over it so it would stand out a bit more in the screenshot.

Cheers

Del

Why is it a different colour in Firefox?

Hard to tell from that short snippet.:slight_smile:

It could be a clearing issue so make sure the table that follows the link is set to clear:both.

Other than that I’d need more code or see the live example.

And attached is how it should look, as per Firefox.

Cheers

Del