Lining up text & background in an if/else

[chrisj]

I'm using a script where if you log-in incorrectly a message appears. Unfortunately the message doesn't appear even. None of the text lines line up.

"Log-In Error
You may have entered incorrect Log-In information
or your account is not activated or has been closed.
Please Sign-Up or contact us regarding this error."

I asked for help lining up the Text and was told to add <div>'s like so:

if ($account_status_id == 5) 
{    // membership end    $account_type_panel = $account_type->get_account_type_panel($account_type_id);  

$content = @$this->system->template->compile_template("renew_signup_page.htm",get_defined_vars());}else {    $login_message = "Error login";    

$content = $this->show_message_page("<br><br>Log-In Error "," <div align=\"left\">You may have entered incorrect Log-In information <br>or your account is not activated or has been closed.<br><br>Please Sign-Up or contact us regarding this error.</div>");}  

And it worked and I asked about adding a background color and was given this:

$content = $this->show_message_page("<br><br>Log-In Error "," <div align=\"left\" style=\"background-color: #ccc;\">You may have entered incorrect Log-In information <br>or your account is not activated or has been closed.<br><br>Please Sign-Up or contact us regarding this error.</div>");

But this only adds background color to each line of text. Is there any way to expand the background color into one larger box around the text?

I've attached an iamge of what it looks like. Any help will be appreciated. thanks.

[bpat1434]

Well, what you're seeing isn't really a "bug" per-se.

The <div> does have a solid background. If you look, the 4 lines of text describing the error all have a solid white background without breaks. The problem lies in the positioning of the elements. Since the text "Login Error" is in a different div, you either need to find that div's style element (or class definition) and make that bottom margin 0 or edit the current div to make it's top margin 0. Without full code, it's difficult to give an exact answer.

I know it's not much to go on, but it's the best I can do with such little information. Also, note that you can use a negative top margin number to move the div up vertically. So you could use:

margin-top: -75px;

To move the <div> element 75 pixels up on the screen.