is there a special reason for setting the post navigation to display none on screens under 768px ?
i have set up the media query to the following and it looks for me ok on my iphone ( i shrinked a little bit for that case
@media only screen and (max-width: 767px) {
.responsive #top .avia-post-nav { display: block }
#top .avia-post-next {background:none repeat scroll 0 0 rgba(255,50,50,0.6);top: 65%}
#top .avia-post-prev {background:none repeat scroll 0 0 rgba(50, 100, 255,0.6);top: 65%}
#top .avia-post-nav {height: 60px;margin-top: -55px;padding: 15px}
.avia-post-nav .entry-info-wrap {margin-top: -11px}
.avia-post-nav .entry-info {height: 50px;width: 180px}
.avia-post-nav .entry-image {height: 50px;width: 50px}
.avia-post-nav .entry-info span {display: table-cell;font-size: 13px;line-height: 1.3em;vertical-align: middle}
.avia-post-nav .entry-image img {display: block;height: auto;width: 50px}
.avia-post-nav:hover .entry-info-wrap {width: 200px}
}
Hi Guenter!
It’s because to display them you need to hover over the icons and on mobiles you cannot hover so it makes more sense to just hide them on mobiles (or other small screens).
Regards,
Elliott
yes you are right – and yes it might be better to place instead only arrows. But i’m a lazy bone so i take them because they are there. The horizontal Navigation is definitly a brilliant thing. And the option to switch in a certain Category