Hey,
Can you tell me which widgets you’re using in your topbar?
Thanks!
Hannah
subscribe email – jetpack
social and search.
This css should align your subscription widget:
#topbar-search form {
float: none;
}
Are you using a different social widget in your topbar than in your footer?
Hannah
Hannah
Thank you, that tidied things up a little, all three widgets now sit neatly in a row one above the other in the middle of the topbar.
however is it possible to line them horizontally?
and how do I get rid of the word social?
Are you using the virtue: social links widget? That by default should display inline. It also will allow you to leave the title blank (so the word social would now show).
Hannah
Hannah
Excellent you just solved one annoyance! I was using jetpack social widget, changed to virtue and looking better. Thank you.
However the subscribe to email (jetpack) and search still nestle under each other. Which means the topbar is really deep. Is there any way for them to go horizontal?
another suggestion?
Try paying around with this css:
.topclass #subscribe-email input {
width: 50%;
float: left;
margin-right: 10px;
margin-left: 20px
}
span.topbar-widgettitle {
margin-left: 20px;
}
.virtue_social_widget.clearfix {
width: 20%;
float: left;
}
Hope that’s helpful!
Hannah
Hannah
It helped a bit, certainly looks more attractive but still not all there
thought I should show you all the css I have added now as one of those codes could be hindering, what do you think?
.topbar-widget .virtue_social_widget a i {
font-size: 22px;
}
#cat_nav {
display: none;
}
body.blog #cat_nav, body.single-post #cat_nav {
display: block;
}
.topbarmenu ul li a {
font-size: 15px;
line-height: 50px;
}
#topbar-search form {
float: none;
}
#topbar-social form {
float: none;
}
#topbar-subscription form {
float: none;
}
.topclass #subscribe-email input {
width: 50%;
float: left;
margin-right: 10px;
margin-left: 20px
}
span.topbar-widgettitle {
margin-left: 20px;
}
.virtue_social_widget.clearfix {
width: 20%;
float: left;
}
Ok, try adding this:
@media (min-width: 992px) {
.col-md-6.col-sm-6.kad-topbar-left {
width: 35%;
}
.col-md-6.col-sm-6.kad-topbar-right {
width: 65%;
}
#topbar-search form {
float: right;
width: 50%;
}
span.topbar-widgettitle {
line-height: 40px;
}
p#subscribe-email {
margin: 0;
}
}
How’s that?
Hannah
oh much better! thank you!
nearly there, only thing is the ‘subscribe by email still isn’t sitting above the email form and button.
how do we move it to the right?
Here ya go:
div#subscribe-text {
margin-left: 20px;
}
Hannah
