Responsive & Mobile-friendly Menu / Posts /

Is there any way to have a logo on left top that does not disappear with mobile browser?

4
Responsive horizontal drop down menu, it seems to hide logo on top left when size is altered by mobile browser. Can it be unhidden and be on top of browser instead? Also, how can the horizontal menu be more right side instead of right side of center? it looks horizontal menu has left align.
Bobbie  10 years ago   viewed: 7656    

5 Answers

0
In the demo Menucool has intentionally hide the logo through its CSS settings.
You can remove the settings for class hide1 in the ddmenu.css, and then the logo will not be hidden.
Milo   10 years ago
-1
Hi, I took class hide1 in <li> from html side but it still hides inside of toggle menu. Is there anyway to have it above toggle?
Also, another thing about the menu drop down, it looks like it is within container of header with limited width and it's left align. Is that right? If so, How/where can I make a change so that it looks 100% width, with top left align logo and right align drop down menu on the same row?
Bobbie   10 years ago
0
You need to check both the HTML and CSS so that it is not set hidden when it falls into a media query.
As to the 100% width, you can place it outside of the header element so that if header is not 100%, the menu can still be 100%.
Milo   10 years ago
0
But how do I keep the nav menu on right side on the same row as the logo? I reduced the width to 50% for the menu and let the logo float on left. But now the drop down menu is aligned center.And with your explanation of placing logo above header wouldn't let me place the logo and menu on the same row. Is it possible to tweak this template to have logo and menu on the same row left and right, then have a logo on top when media query is in effect?


Bobbie   10 years ago
1
You can set the menu to: #ddmenu { text-align:right; }
And then set the logo item within the menu as: style="float:left;"

As to forcing the logo staying at the top when there is no enough space, you have to use the @media query to set something like: 
li.hide1 {position:relative; top:-30px;}
Milo   10 years ago

   

Your name*
Password
(Optional. Used to modify this post afterwords)
+ =  

Ask your Own Question

▲