Layout Issues [SOLVED]

I am working on a site that has a div with the id of "userWelcome" in the header area.

When the user first enters the site, if they are not logged in, this div contains a span with the id "userLogin", which contains inputs for Name and Password, and a "Login" button.

Once the user has logged in, this span is apparently replaced by a div with the id "welcomeBackBar", which contains the user's name and some additional links in the form of a < ul >, depending on the user's account type.

The problem I am encountering is that we have an updated version of this product which has included a search bar in an additional div with the class of "searchControls". It apparently added this to the div with the id of "userWelcome", and it is pushing the other elements (the log-in fields and/or the user's name and additional links once they are logged in) over to the side.

I have[...]what I believe to be the relevant CSS is below. There are at least two very long style-sheets that this product is using (one for the main styles and the other for "theme" styling), so it wouldn't make sense to post them in their entirety to this forum post.

All I am trying to do is set it up so that the search bar appears beneath the login fields / user's name and additional links.

Any suggestions would be appreciated. I think this is just one of those cases of "trying to do something simple in an overly complex environment".

Thanks!

/*This code is from style.css, from the Accord Theme*/

/* =WelcomeBack
------------------------------------------*/
#welcomeBackBar {
    background: none;
    height: 24px;
    margin: -62px auto 32px auto;
    max-width: 1200px;
    min-width: 960px;
    text-align: right;
}
#userLogin, #userWelcome {
    position: relative;
}
#userLogin label {
}
#userName {
    padding: 2px 4px;
    width: 100px;
}
#password {
    padding: 2px 4px;
    width: 100px;
}
#btnLogin {
    -khtml-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid #d2d2d2;
    height: 19px!important;
    margin: 2px 0 0 0;
    padding: 2px 6px 6px 6px;
}
#btnLogin:hover, #btnLogin:focus {
    background: #060;
    color: #fff;
    cursor: pointer;
}

/*This code is from siteStyle.css, from the Common Styles*/

/* Search */
.searchControls input {
    position: relative;
    top: -4px;
    margin-right: 0;
}

#welcomeBackBar .searchButton, #sideBar .searchButton {
    background-image: url("../images/PortletImages/Icons/search-button-sprite.png");
    background-position: 0 0;
    display: inline-block;
    height: 23px;
    margin-bottom: -4px;
    margin-top: 3px;
    padding: 0;
    width: 38px;
}

    #welcomeBackBar div#userWelcome {
        padding: 4px 5px;
        /*width: 560px;*/
        display: block;
        padding-top: 6px;
    }

[SOLVED]

I got it to work! As it turns out, everything at the top of the page is positioned using absolute values, and the position of the Search bar is dependent on a "float".

Once I gave the header area some more vertical space, I was able to just remove the float from the search bar, which positioned it above the line containing Log In fields / Welcome Back message.

Thanks for the assistance!