Secondary Nav Floats Wrong Responsive

Homepage › Community Forums › Epik Theme Support › Secondary Nav Floats Wrong Responsive

Tagged: , ,

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • August 29, 2015 at 6:33 pm #16332
    JokeAndBiagio
    Customer

      Hi,

      I’m having an issue where I have social media icons in the secondary nav, and I’ve floated this right. It’s working okay when browser is full width, but once the “hamburger” pops in as the viewport shrinks, the social icons float left, reverse order and have a large gap between them.

      I don’t mind that the icons move to the left, but would like to cure the large gap between them first and foremost, and would still like twitter to pop up before facebook if possible.

      Here’s the issue:
      http://tor.jokeproductions.com

      Thanks!
      Biagio

      August 29, 2015 at 9:29 pm #16336
      Wes
      Moderator

        Add this to your Responsive section (767 width) – 

        #menu-social-media .menu-facebook,
#menu-social-media .menu-twitter {
	float: right;
}

        You can add it under the section labeled as this – 

        /* iPhones (portrait and landscape)
--------------------------------------------- */

@media only screen and (max-width: 767px) {
        August 30, 2015 at 1:48 am #16343
        JokeAndBiagio
        Customer

          Thanks Wes. That solved all the spacing issues. One last question — now that I’ve looked at it on the iphone, it’s a little hard to get to them since they’re right above the hamburger. Is it possible to keep this same spacing but have them jump to the left hand side? I tried the code you gave me with “float left” instead, but it was the same issue with the big gap between them.

          Thanks so much for your help!
          Best,
          Biagio

          August 30, 2015 at 1:53 am #16344
          Andykev
          Customer

            Biagio,

            Perhaps a plug-in? I have used this and it is great. Works on Iphone too. This puts the social medial icon on the webpage and it “floats”. This is someting to try, and see if you like what it does.

            https://wordpress.org/plugins/floating-social-media-icon/

            August 30, 2015 at 2:14 pm #16345
            JokeAndBiagio
            Customer

              Thanks, Andykev. We might actually check that out for our blog and podcast. We’re going a little smaller and less obvious on our business site (at my wife and business partner’s request) but I really do like the plugin.

              I think my main goal right now is to try to figure out how to lower those two icons, or if there’s a better place to put them in the theme other than secondary nav.

              Thanks!
              Biagio

            • Author
              Posts
            Viewing 5 posts - 1 through 5 (of 5 total)
            • You must be logged in to reply to this topic.