• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 366
  • Last Modified:

My form is not styled right, help! =)

I added a form to my side bar widget in Wordpress and the fields are over lapping and the Send button is at the top and not under the form. What can I do?

1 Solution
Jason C. LevineNo oneCommented:
Hi jbrashear72,

In default.css there are the following entries:

.aside input {
    background: url("../../images/bg-news.jpg") no-repeat scroll 0 0 transparent;
    border: medium none;
    height: 26px;
    padding-left: 5px;
    position: absolute;
    top: 25px;
    width: 200px;

.aside, .aside input {
    font-size: 13px;
    line-height: 18px;
    margin-bottom: 6px;

The position: absolute is what is causing the most visible issue.  Once you remove that, you'll still have some minor issues with the form, but those are also easily correctable via the CSS.

Generally, when you use a plugin to create a widget with a form, the widget is going to inherit styles from both the theme and the form plugin specific stuff.  This can cause a CSS conflict in the widget with the results you saw.

Featured Post

Vote for the Most Valuable Expert

It’s time to recognize experts that go above and beyond with helpful solutions and engagement on site. Choose from the top experts in the Hall of Fame or on the right rail of your favorite topic page. Look for the blue “Nominate” button on their profile to vote.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now