How can I fix this layout built with twitter bootstrap

I'm working on a sample form layout with twitter bootstrap. The form lists the fields in horizontal order and in between the fields I have a link. When this link is clicked I would like to show some bullet points on the right of the fields. However these bullet points are not lining up well with the form on the left.

Example: http://jsfiddle.net/MgcDU/3643/

Questions

  • How can I have the bullets on the right side be inside the same grey box that the form is in. These bullets server as additional information for the form and having them in separate grey box looks weird.
  • The space between field One and Two is a lot just because I added a link. How can I make the space consistent?

Answers


Nest the bullets on the right hand side inside your form box container element, and the extra space is being added to the <p> element - add a class to identify it and reduce it in the CSS.


Need Your Help

500 internal server error at GetResponse()

c# .net asp.net web-services web-applications

I have a heavy traffic aspx page calling a web service upon every user`s request as follows.

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.