At first it was just a simple href link with a background image, and they all stacked next to each other nicely.
Now I added a little php if condition where if user is logged in show “Logout” link, otherwise show “Login” link and what it does now is add a weird extra spacing on both sides of the button, which it turn makes other buttons slide next line.
The button has the same class and styling, and identical to the other link buttons except for that php if statement.
The illustration:
[url]http://img441.imageshack.us/img441/9020/19024875.gif
PHP condition:
[CODE]
<?php if (!$signed) { ?>
<a class=”button” href=”<?php echo str_replace(‘&’, ‘&’, $signed); ?>”>Login</a>
<?php } else { ?>
<a class=”button” href=”<?php echo str_replace(‘&’, ‘&’, $signout); ?>”>Logout</a>
<?php } ?>
CSS for button:
[CODE]
#menu .button {
margin-left: 1px;
margin-right: 0px;
margin-top: 0px;
width: 101px;
height: 40px;
background: url(button.gif) no-repeat;
display: inline-block;
border: 0px;
}
What is causing that kind of behavior?
Its cross browser issue by the way, and no I don’t use ie6.