Forum Replies Created
-
Posts
-
How about this issue: vertical alignment of single line menu items with 2 line menu items – I want Home | Camps | (single line menu items) vertically aligned with the 2 line menu items such as: Anti-Gravity Airbag
Thanks
i figured it out – I decided I liked the alignment the way it was and then I added this for mobile devices – :
@media only screen and (min-width: 320px) and (max-width: 480px) {
#header_meta .container { position: relative; top: 1px; }
#header_meta { margin-top: 0px; }
.html_header_top.html_header_topbar_active.html_header_sticky.html_large.html_bottom_nav_header #top #main { padding-top: 162px;
}
}I changed it to:
#header_meta .container { position: relative; top: 50px; }
#header_meta { margin-top: -36px; }
.html_header_top.html_header_topbar_active.html_header_sticky.html_large.html_bottom_nav_header #top #main { padding-top: 162px; }So that it won’t overlap the menu on shrinking the logo – but it would look better if it was centered when the logo was big and when the logo shrinks… is that possible?
Thanks for the help!
If I use that code how can I get the phone and facebook icon to adjust appropriately when the user scrolls down with the shrinking logo? DNS issues are resolved. Gravity Forms
Sorry there apparently were some DNS issues – which have been resolved. Could you please advise on the mega menu spacing shown with the red arrow above and the vertical alignment of single line menu items with 2 line menu items
What do you mean it’s not loading for you? Perhaps you’re still seeing the old site and need to flush your DNS?
http://www.gravitygroms.com – sorry we went live today. Still having the issues with the megamenus looking weird. And the menu items not being vertically aligned
I’ve tried creating this same effect – except for a centered logo (to show the phone number on the left).
I added this:
div.phone-info {
left: 0;
position: relative;
top: 85px;
}
.phone-info span { font-size: 24px;
color: #ffffff; }@media only screen and (max-width: 480px) {
.phone-info span {
font-size: 18px;
}}#header_meta {
height:0px;
min-height: 0;
}How do I completely remove the top line since it is not needed? “header_meta”
I tried display:none – but that gets rid of the phone number too that I just added.For now I moved it all back to the top bar being that with the shrinking logo it ends up on top of the menu. Ideally I want the Phone Number to the left of the logo that will respond appropriately when the logo shrinks upon scrolling – and the facebook icon to the right of the logo.
Thanks!
You guys are great. Any chance to center the menu items vertically in the header? The menu does not work in responsive mode – Division ends up on top of Fire. –
UPDATE – I added this and it seems to work for responsive mode:
@media only screen and (min-width: 320px) and (max-width: 480px) {
span.menu-break {
position: inherit !important;
}
}
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
span.menu-break {
position: inherit !important;
}
}Still looking to center the menu vertically within the header.
There’s no way around it using the built in contact form? It’s only the section with the dates and checkboxes that is complex.
you see that the video would stop on the logo… but instead it flops back to the beginning which doesn’t look good.
I think I’ve found a bug. If I turn off the menu under Appearance>Menus and let the pages develop the menu on their own based on Order and Parents – then the above fix will work… however that is not an acceptable answer really…
I tried changing the width to 989 and I’m still having issues with my menu showing up under my logo on an iPad and other similar devices:
http://www.alpineorthopaedics.comI just changed it to 1024 and it still doesn’t work…. is there a way to have the menu font size shrink responsively so that the original menu would still show up on an iPad and not encroach under the logo?
