Menu icon Foundation

Engineer | Vancouver, BC

The title above is a little misleading. I think jack, or jane, of all trade is more accurate

My Posts


My Comments

Karima Premji commented on Adam Sherman's post 7 months

ANSWER FOUND: add to stylesheet
.is-drilldown { min-height: 0!important;}
Should have remembered the cascading part of stylesheet ;(
---------------
hello Rafi
I'm using F6.2.0 so that I can place a responsive dropdown with drilldown option.  I have this working beautifully.  However like others, i'm having an issue with the extra space the drilldown is taking on mobiles. I have added the attributes as listing in the above documentation, with no success.  I was looking in firebug and noticed that if I simply removed the inline style of min-height, it did the trick.
Since this is part of the js and probably used elsewhere in the code, I did not want to simply comment it out of the js.  How can i bypass this?

Karima Premji commented on Karima Premji's post 8 months

I reverted back to F6.2.0 and finally got the menu working as drilldown for small and medium, dropdown for large.
I have a minor question regarding the drilldown on iphone 6S.  Panels 2+ are given an inline height.  but when you click back, that height remains and leaves a lot space before any content is seen.  how can i reduce this?  in the js?

Karima Premji commented on Heidi Lambeth's post 8 months

did you include this css rules for small screen
.no-js .top-bar { display: none; }
and for @media only screen and (min-width: 40em) {    .no-js .top-bar { display: block; }    .no-js .title-bar { display: none; }
}
lastly, last line below the js calls should be
<script>    $(document).foundation();</script>

Posts Followed



  • 5
    Replies
  • Responsive Menu Question (F6)

    By Heidi Lambeth

    First of all, let me start by saying I am totally new to Foundation but am excited about the possibilities. I am trying to use the Responsive Top Bar Menu and have it display only on small screens. I have copied the code almost exactly, but for some rea... (continued)

    Last Reply by Karima Premji 8 months ago


Following

    No Content

Followers

My Posts

My Comments

You commented on Adam Sherman's post 7 months

ANSWER FOUND: add to stylesheet
.is-drilldown { min-height: 0!important;}
Should have remembered the cascading part of stylesheet ;(
---------------
hello Rafi
I'm using F6.2.0 so that I can place a responsive dropdown with drilldown option.  I have this working beautifully.  However like others, i'm having an issue with the extra space the drilldown is taking on mobiles. I have added the attributes as listing in the above documentation, with no success.  I was looking in firebug and noticed that if I simply removed the inline style of min-height, it did the trick.
Since this is part of the js and probably used elsewhere in the code, I did not want to simply comment it out of the js.  How can i bypass this?

You commented on Karima Premji's post 8 months

I reverted back to F6.2.0 and finally got the menu working as drilldown for small and medium, dropdown for large.
I have a minor question regarding the drilldown on iphone 6S.  Panels 2+ are given an inline height.  but when you click back, that height remains and leaves a lot space before any content is seen.  how can i reduce this?  in the js?

You commented on Heidi Lambeth's post 8 months

did you include this css rules for small screen
.no-js .top-bar { display: none; }
and for @media only screen and (min-width: 40em) {    .no-js .top-bar { display: block; }    .no-js .title-bar { display: none; }
}
lastly, last line below the js calls should be
<script>    $(document).foundation();</script>

Posts Followed

Following

  • No Content

Followers

  • No Content