Using lead capture widget other than on home page.

I have the lead capture widget on the home page and it works fine, but I would like to also have it in the sidebars of other pages, and it looks cut off. How can I either make the lead capture widget more responsive to its container or make the non-homepage sidebar the same size as the homepage one?

Site: http://denisehockley.com/test

 

Hello,

Greetings from InkThemes!

Please paste the code given below in Custom CSS section (Appearance -> Theme Options -> Styling Options -> Custom CSS) of your dashboard.

Code:

.sidebar {
    padding-left: 0;
    padding-bottom: 25px;
}
@media only screen and (max-width: 960px) and (min-width: 767px){
.sidebar {
    width: 100%;
    padding-left: 6px; 
}
}

Hope it will resolve your issue

Do let me know if you need more assistance,

Thanks & Regards!
Priyanka
InkThemes.com

 

I pasted the code shown as described. It changed some things but made others worse The problems are most apparent on computer screens

1. The form partially obstructs the main column on computer screens
2. The padding on the right side of the form is much larger than on the left
3. The Recaptcha image and Send buttons spill outside the form boundaries to the right (this may be the cause of 1 and 2).

See http://denisehockley.com/test/locaton

 

correct url http://denisehockley.com/test/location/.

 

Hello,

Would you please try below code and check after that...

Code:

.inkleadsform .signinForm ul.inkleadsul li.inkleadsbutton input[type="submit"] {
    margin-left: 0;
}
.sidebar {
    padding-left: 45px;
}
@media only screen and (max-width: 480px){
.sidebar {
    padding-left: 0;
    width: 100%;
}
}
@media only screen and (max-width: 960px) and (min-width: 767px){
.sidebar {
    width: 100%;
    padding-left: 13px;
}
}

Note: Adjust the numeric value as per the requirement..

Hope it will resolve your issue

Do let me know if you need more assistance,

Thanks & Regards!
Priyanka
InkThemes.com

 

Better but still not quite. The ReCaptcha and the send button still are misplaced on computer screens.

 

Hello,

Please paste the code given below in Custom CSS section of your dashboard.

Code:

img#recaptcha_challenge_image {
    width: 90%;
}
.inkleadsform .signinForm ul.inkleadsul li.inkleadsbutton input[type="submit"] {
    width: 100%;
    margin-left: 0;
}

Hope it will resolve your issue

Thanks & Regards!
Priyanka
InkThemes.com

 

Almost perfect except for one thing: hovering the mouse over the button causes the button to jump out of the frame.

 

Hello,

Use below code..

Code:

.inkleadsform .signinForm ul.inkleadsul li.inkleadsbutton input[type="submit"]:hover {
    width: 100%;
}

Thanks & Regards!
Priyanka
InkThemes.com