Search code examples
jquerytabslideout

Regarding the usage of jquery tabSlideOut plugin


i was using jquery tabSlideOut plugin for our site and it was working fine. here are some url from where u can see it is working fine

http://www.bba-reman.com/ http://www.bba-reman.com/content.aspx?content=how_to_contact_bba_reman_it

but when u go to this page http://www.bba-reman.com/catalogue/Register.aspx then u notice UI clutter. here is the screen shot enter image description here

so please see my page and tell me where i made the mistake which causes this problem. please guide me what i need to modify. thanks


Solution

  • In the registration page, your input fields are longer than in the rest of the site. According to the element inspector there's a line of CSS in register.aspx: input[type=text], input[type=password] {width: 300px;}. This rule is general and affects ALL input fields on the page, both the ones in the registration form and the ones in the slide out tab.

    Options are:

    1. Remove that rule. The tab will look ok, but the input fields in the registration form will not look aligned.
    2. Use a more specific CSS rule to affect only the input fields in the registration form: #Register input[type=text] {width: 300px;}

    As a side note, I'd suggest avoiding inline and in-file CSS, it makes everything messy.