Misaligned 'search' bar & button

Support has been upgraded!

The Support Forum is closed. Not to worry! Providing the top quality support you expect and we're known for will continue! We're not ending support, just changing where you submit requests. This will provide you with the best experience possible.

Premium Support

Have you purchased an addon for Connections such as one of our premium templates or extensions with a valid license and you need help?

Please open a Support Ticket in your user account.

Click here to open a support ticket.

Free Support

Are you using the free Connections plugin? Don't worry, you are still very important to us! We are still providing you with the same high quality support that we're known for.

Please open a new support topic in the WordPress support forums for Connections.

Click here to open a support topic.

This topic is: resolved

Tagged: 0.8.13, css, search

This topic has 10 replies, 2 voices, and was last updated 12 years ago by Steven Zahm.

Viewing 10 posts - 1 through 10 (of 11 total)

1 2 →

Author

Posts
07/02/2014 at 10:42 am #295787

Chester County Chamber of Commerce
Participant

Aloha! I bought the cMap template today, and am very excited about it’s polished look. When I activated the template, the search button and bar are misaligned. This is most likely an issue with the theme (I’m guessing), but I don’t know where to go to begin trying to fix this. I would feel bad to do this, but can I just turn off the search feature temporarily? I’m on a TIGHT deadline and I can tweak the small stuff later. Any thoughts? Thanks in advance for any and all help!!!

Christi

Attachments:
You must be logged in to view attached files.

07/02/2014 at 10:48 am #295789

Chester County Chamber of Commerce
Participant

Also, and this is just me being curious, is there any way to stop the entries from double spacing lines? Please refer to the screen-cap as an example. Thanks again!

07/02/2014 at 9:33 pm #295832

Steven Zahm
Keymaster

The issue is definitely a conflict with the theme … its overriding the CSS for Connections which is what is supposed to happen for the clear search button, not the search button. I’ll need a direct link to your directory page in order to give you the CSS that would fix this.

The double spacing is also likely to be caused by the theme. Here’s link to a FAQ that fixes this issue nearly 100% of the time.

07/03/2014 at 8:54 am #295876
Chester County Chamber of Commerce
Participant
Thank you so much Steven! Here is the link for the directory. I gathered it was a theme issue when the search button became the same one used in the theme’s contact form. Glad to know my intuition was correct.

I read the FAQ regarding the double spacing and will work on implementing those solutions today.

You have been wonderfully helpful here; thank you again for your reply!
- This reply was modified 12 years, 1 month ago by Chester County Chamber of Commerce.
07/04/2014 at 9:02 am #296015
Steven Zahm
Keymaster
This will probably take a few passes to get right because theme seems to be using JavaScript to rewrite the HTML markup of plugins. Add the following to the theme’s custom CSS area. Let me know when you do and I’ll take another look to see what we need to do next.
```
button#cn-search-submit {
	background:  #FFFFFF url(../images/icons/search.png) no-repeat 8px center !important;
	border-width: 1px 1px 1px 0 !important;
	border-style: solid !important;
	border-color: #DFDFDF !important;
	border-radius: 0 3px 3px 0 !important;
	-moz-border-radius: 0 3px 3px 0 !important;
	-khtml-border-radius: 0 3px 3px 0 !important;
	-webkit-border-radius: 0 3px 3px 0 !important;
	box-shadow: inset 0 1px 1px rgba(0,0,0,0.1) !important;
	-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.1) !important;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.1) !important;
	box-sizing: border-box !important;
	-moz-box-sizing: border-box !important;
	-webkit-box-sizing: border-box !important;
	cursor: pointer !important;
	font-size: 12px !important;
	float: none !important;
	height: 28px !important;
	line-height: 20px !important;
	margin: 1px 1px 1px 0 !important;
	padding: 3px !important;
	text-align: left !important;
	vertical-align: bottom !important;
	width: 30px !important;
}
```
07/10/2014 at 2:39 pm #296654

Chester County Chamber of Commerce
Participant

I’m sorry for the delay in response! I added the above CSS to the main style doc. I didn’t see a change. Please let me know if there’s anything else I can provide.

Christi

07/14/2014 at 3:39 pm #296969
Steven Zahm
Keymaster
Ok, here’s the same CSS with some additional tweaks:
```
button#cn-search-submit {
	background: #FFFFFF url(http://chesterchamber.com/wp/wp-content/plugins/connections/assets/images/icons/search.png) no-repeat 8px center !important;
	background-image: url(http://chesterchamber.com/wp/wp-content/plugins/connections/assets/images/icons/search.png) !important;
	border-width: 1px 1px 1px 0 !important;
	border-style: solid !important;
	border-color: #DFDFDF !important;
	border-radius: 0 3px 3px 0 !important;
	-moz-border-radius: 0 3px 3px 0 !important;
	-khtml-border-radius: 0 3px 3px 0 !important;
	-webkit-border-radius: 0 3px 3px 0 !important;
	box-shadow: inset 0 1px 1px rgba(0,0,0,0.1) !important;
	-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.1) !important;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.1) !important;
	box-sizing: border-box !important;
	-moz-box-sizing: border-box !important;
	-webkit-box-sizing: border-box !important;
	cursor: pointer !important;
	font-size: 12px !important;
	float: none !important;
	height: 28px !important;
	line-height: 20px !important;
	margin: 1px 1px 1px 0 !important;
	padding: 3px !important;
	text-align: left !important;
	vertical-align: bottom !important;
	width: 30px !important;
}

#cn-cmap .btn span {
	background: none !important;
	background-image: none !important;
}

a#cn-clear-search-button {
	background: none !important;
	background-image: none !important;
}
```
I think that’ll fix it this time.
07/14/2014 at 3:48 pm #296971

Chester County Chamber of Commerce
Participant

Thank you SOOO much! That fixed the issue! This is honestly the BEST customer service/ support experience I’ve ever had… thank you again!

07/14/2014 at 6:40 pm #296986

Steven Zahm
Keymaster

Great to hear that worked! There’s still the double spacing where I linked to the likely solution in this reply. After you enable that option, the display should look much better.

If you have a moment, I would truly appreciate a review as they really do make a difference. Many thanks in advance!
http://wordpress.org/support/view/plugin-reviews/connections

07/31/2014 at 9:38 am #299149

Chester County Chamber of Commerce
Participant

I left a great review for Connections; it is definitely well deserved! Also, I finally got a chance to change that setting and that did exactly what I wanted it too :D Thank you, again!
Author

Posts