Drop down login dropping down to the right and overflowing page

I am using code that I found from the following website:

http://ift.tt/1eP6cGb

I am using the code in the header tags. When I save the code and view it on my local website, I get something that looks like the screen shot that I have attached, where the login runs off the page to the right. Anyone have any ideas?

Any help is greatly appreciated. Please let me know if I have not supplied enough detail.

        <div class="navbar navbar-inverse navbar-fixed-top">
            <ul class="nav navbar-nav">
            <li><a href="index.php">Home</a></li>
            <li><a href="">About Us</a></li>
            <li><a href="contact.php">Contact Us</a></li>
            <li><a href="signup.php">Sign Up</a></li>
            </ul><!-- nav -->   
             <div class="nav-collapse collapse">
    <ul class="nav pull-right">
      <li><a href="register.php">Register</a></li>
      <li class="divider-vertical"></li>
      <li class="dropdown">
        <a class="dropdown-toggle" href="#" data-toggle="dropdown">Log In <strong class="caret"></strong></a>
        <div class="dropdown-menu" style="padding: 15px; padding-bottom: 0px;">
            <form action="login.php" method="post"> 
                Username:<br /> 
                <input type="text" name="username" value="<?php echo $submitted_username; ?>" /> 
                <br /><br /> 
                Password:<br /> 
                <input type="password" name="password" value="" /> 
                <br /><br /> 
                <input type="submit" class="btn btn-info" value="Login" /> 
            </form> 
        </div>
      </li>
    </ul>
  </div>