What’s the easiest way to center the logo on the mobile menu/navigation and to have the search icon on the right-hand side?
Hi,
There is no easy solution, what you can do is to align it manually from CSS, with left, right but is not flexible on all devices. You can inspect it and take a look. Is complicated, sorry for the inconvenience!
Thanks!
Ok, so you also have no plan to add this as an option for version 3.x of this brilliant theme?
Hello,
I’m not sure, we want to improve the menu, to add one like mega menu but custom made.
Thanks for the suggestion!
To center the logo:
@media (max-width: 767px) {
.mobile-logo-wrap img {width:170px;position:absolute;left:0;top:-3px;margin-left:auto;margin-right:auto;}
}The key is auto margins. I’ve only tested this on my Galaxy S3 but it works for both landscape and portrait.
Hi,
Use this:
@media (max-width: 767px) {
#td-top-search {
position: absolute;
right: 13px;
top: -3px;
}
.header-search-wrap .dropdown-menu:before {
left: auto;
right:31px;
}
.header-search-wrap .dropdown-menu {
right: -14px;
left: auto;
top: 49px;
width: 320px;
}
}Great, thx a lot.
Hi,
Please provide a link, so we can take a look.
Thanks!
I deleted that previous code for now.
I know that this may not be the right topic to discuss this about, but how can i get my post images smaller on the iphone landscape mode. Because on the portait mode the post pictures are good
Hi,
1. You have this on mobile screen: http://screencast.com/t/UfJ9Y6qX48
The code from above that you tested is for mobile logo: http://screencast.com/t/8p7ptjkC
I’m not sure what are you trying to do with search icon…if you want to move search icon yo have to use also Marius css code: http://screencast.com/t/LmmlgSGpW
@media (max-width: 767px) {
#td-top-search {
position: absolute!important;
right: 13px!important;
top: 0px!important;
}
.header-search-wrap .dropdown-menu:before {
left: auto!important;
right: 31px!important;
}
.header-search-wrap .dropdown-menu {
right: -14px!important;
left: auto!important;
top: 49px!important;
width: 320px!important;
}
.mobile-logo-wrap img {
width: 170px;
position: absolute;
left: 0;
top: -3px;
margin-left: auto;
margin-right: auto;
}
}
2. This can be done only with css as theme doesn’t have an option for this. You can use @media for landscape – http://stephen.io/mediaqueries/#iPhone and add your css for post images.
Thanks!
Hi!
Thanks for the help, it really helped me!
I just can’t get the iphone landscape homepage post pictures smaller, they fill my whole iphone 6 screen. What css should i add according to this http://stephen.io/mediaqueries/#iPhone .
I would normally allow the Big slider also in the portrait mode but there is some kind of big space between the menu and the big slider, do you know how to help me with this one ? or do i just make a new topic
thank you so much for your help!
Hi,
You can try this css code for images on post page: http://screencast.com/t/qUkH233SxOJ
@media (min-width : 375px)
and (max-width : 667px) and (orientation : landscape){
.single img{
max-width: 50%;
}
.td-post-featured-image{
text-align: center;
}
}
Please try this css code for space between the menu and the Big Slider: http://screencast.com/t/C9pB6IcgUF
.home .td-grid-wrap {
padding-top: 10px;
}
Thanks!
Thank you for your advice, but i ment the gap in the mobile view. Sorry, i think i forgot to mention that properly.
I made a totally new topic for all my problems now 🙂 thanks for all
If you have some advice for me you can visit : https://forum.tagdiv.com/topic/ipad-and-mobile-homepage-post-image-size-problems/
Thank you so much for your help !
