[dal]

Thanks, the first code works perfectly.

[dal]

Update: By using a combination of your code and Ben’s original code, I’ve finally got rid of the dropdown menu, and have the filter underneath the centred menu on portrait and landscape iPhone. It may not be the most efficient way, but it works!

@media only screen and (max-width: 767px){
#main-navigation{
float:none;
margin:0px auto;
}
#main-navigation ul{
text-align:center;
}
#main-navigation ul li{
float:inherit;
}
}

@media only screen and (max-width: 767px){
#mobile-navigation{
display: none;
}

#main-navigation{
display:block;
margin-top: 20px;
}
}

[dal]

Hi Laranz,

If I move your code to below mobile navigation and above the main navigation, i.e:

@media only screen and (max-width: 767px){
#mobile-navigation{
display: none;
}

.portfolio-filter-wrap{
clear:both;
}

#main-navigation{
display:block;
margin-top: 20px;
}
}

this moves the filter back to the left of ‘portfolio’, centres the menu on portrait mobile view, but on landscape view, the menu is still moved to the right (Screen-Shot-2013-09-27-at-20.47.23.png in the above post).

So close! Any ideas on anything else I can try?

[dal]

Hi Laranz,

I’ve attached screenshots of what the code does to my site when viewed on screens larger than a portrait iPhone.

With the previous code, on desktop browsers the filter remained to the left of the word portfolio, and on mobiles and smaller screens the filter was centred below the two page options which was perfect. I’d really like to get back to that.

[dal]

Hi Laranz,

The additional code is exactly what I want for mobile, but this code also moves the filter onto a separate line on my PC and larger displays. Can I make this extra piece of code work for mobile only?

Thanks again for the help.

[dal]

Hi Laranz,

Thanks for getting back to me. The code you have given me has worked almost perfectly. I’ve attached a screenshot of what I get, and what I’d prefer. The left is my current result, is there anything else I need to add so the filter button lines up centred underneath the pages like the right example, like it did previously?

Thanks.

[dal]

Hi Ed,

Version 1.5.2 on WordPress 3.6.1. It still happens to me as recently as yesterday.

[dal]

This reply has been marked as private.

[dal]

Of course. The code supplied by Ben worked when I first inserted it, but now it doesn’t. The code hasn’t been edited, moved or replaced, just stopped working.

[dal]

Are you able to offer any more guidance? I presumed it would be editing the header.php, but I’m not completely sure what I need to be editing.

[dal]

No, I mean closer to this site: http://www.wide.pt/work/?page_id=543

With the logo and menu on the far left, the filter on the far right in this example.

[dal]

Hey again,

Since updating to WP 3.6 (I think) this no longer works, and my mobile navigation is back to the original dropdown. Is there anything else I may need to change now?

Thanks again.

[dal]

Perfect!

Thank you for the help.

[dal]

Thank you. I’ve removed this code and although this has removed the dropdown, the resulting buttons are moved over to the right instead of being centred. Is there anything else I need to change to make these centred?