Menu icon Foundation

My Posts




My Comments

Thomas Janotta commented on Thomas Janotta's post almost 4 years

Hi Rafi, could you reproduce the error.

Please remember that this is NOT on handy but on tablet , where the 1. level menu is still fully visibible with dropdowsn!

tks

Thomas Janotta commented on Thomas Janotta's post almost 4 years

Hi Rafi, I cannot work with codepen.
Here's my link to 5.3 and 5.4.6
http://www.thomasjanotta.de/f53
http://www.thomasjanotta.de/f546

Thomas Janotta commented on Thomas Janotta's post almost 4 years

Hi Rafi, yes i will. You cannot use the doc's demo, because they have no "real" links, only hashtags..
I tell you when it's ready... THX

Thomas Janotta commented on Thomas Janotta's post almost 4 years

Hi Rafi, did I mention that it works on ipad os9/safari?

I used the original download to make sure it isn't a coding error from us (tag-nesting etc.). This is really strange...

Thomas Janotta commented on Thomas Janotta's post almost 4 years

Hi Rafi, thanks for reply.
Even when I disable my style, the grid is broken.

<div class="row">
<div id="mainrow " class="small-12 medium-8 large-8 columns">
  <p>left</p>
</div>
<aside class="hide-on-print small-12 medium-4 large-4 columns">
  <p>right</p>
</aside>
</div>

i want to split the medium,
from 641 to 944 each 100%
from 945 to 1024 66/33 %
from 1025 large 66/33 %

but it is broken in ff28

@media only screen and (min-width: 48.0em) { /*768*/
  #mainrow.medium-8,  aside.medium-4 {
    width: 100%;
  }
}

@media only screen and (min-width: 59.0em) { /*944*/
  #mainrow.medium-8 {
    width: 66.66667%;
  }
  aside.medium-4 {
    width: 33.33333%;
  }
}

@media only screen and (min-width: 64.0625em) { /*1025*/
  #mainrow.large-8 {
    width: 66.66667%;
  }
  aside.large-4 {
    width: 33.33333%;
  }
}

but i can use 5.5.1

Thomas Janotta commented on Peterpp's post almost 5 years

Are you working in 4 or 5? In FD5 they changed the medium to 1024 and below. Which is sad, as some content would fit side by side on 1024, but fit under eacht other in 768. So you have to add different media querie behaviour for 1024 and 768.
.-(

Thomas Janotta commented on Philip Meissner's post about 5 years

Hi, it was also in FD 4, but I can't remember how i solved it. (diferent class-names I guess).
It is still there in FD 5.2.3
But the answer by Lincoln Mitchell helps. no visitor resizes/reloads its browser, he just leaves ...

Thomas Janotta commented on Tim Martin's post over 5 years
Thomas Janotta commented on Albert's post over 5 years

Hi, derived from the BASIC solution

http://foundation.zurb.com/docs/components/offcanvas.html

as described in other forum threads, put a div class="fixed" around nav

i use not the span-code but a text inside the a-tag, resp a font-icon "LIST"
("size-36" is a class for the icon-size)

<a class="left-off-canvas-toggle" href="#"><i class="step fi-list size-36"></i></a>

and style with

.size-36{color:white !important;}

and your class "main-section" (article or section)
a margin-top 45px or so

also you have to change the padding-top

for the new "f-topbar-fixed"-class in the javascript (first occurance)

 i.add_custom_rule(".f-topbar-fixed { padding-top: "+t.data("height")+"px }"),

change t.data(height) to 0

maybe someone knows more css/js, but this works for me.
There is a glitch when you watch it in landscape mode...someone could fix this..

tom.

Posts Followed

No Content

Following

    No Content

Followers

My Posts

My Comments

You commented on Thomas Janotta's post almost 4 years

Hi Rafi, could you reproduce the error.

Please remember that this is NOT on handy but on tablet , where the 1. level menu is still fully visibible with dropdowsn!

tks

You commented on Thomas Janotta's post almost 4 years

Hi Rafi, I cannot work with codepen.
Here's my link to 5.3 and 5.4.6
http://www.thomasjanotta.de/f53
http://www.thomasjanotta.de/f546

You commented on Thomas Janotta's post almost 4 years

Hi Rafi, yes i will. You cannot use the doc's demo, because they have no "real" links, only hashtags..
I tell you when it's ready... THX

You commented on Thomas Janotta's post almost 4 years

Hi Rafi, did I mention that it works on ipad os9/safari?

I used the original download to make sure it isn't a coding error from us (tag-nesting etc.). This is really strange...

You commented on Thomas Janotta's post almost 4 years

Hi Rafi, thanks for reply.
Even when I disable my style, the grid is broken.

<div class="row">
<div id="mainrow " class="small-12 medium-8 large-8 columns">
  <p>left</p>
</div>
<aside class="hide-on-print small-12 medium-4 large-4 columns">
  <p>right</p>
</aside>
</div>

i want to split the medium,
from 641 to 944 each 100%
from 945 to 1024 66/33 %
from 1025 large 66/33 %

but it is broken in ff28

@media only screen and (min-width: 48.0em) { /*768*/
  #mainrow.medium-8,  aside.medium-4 {
    width: 100%;
  }
}

@media only screen and (min-width: 59.0em) { /*944*/
  #mainrow.medium-8 {
    width: 66.66667%;
  }
  aside.medium-4 {
    width: 33.33333%;
  }
}

@media only screen and (min-width: 64.0625em) { /*1025*/
  #mainrow.large-8 {
    width: 66.66667%;
  }
  aside.large-4 {
    width: 33.33333%;
  }
}

but i can use 5.5.1

You commented on Peterpp's post almost 5 years

Are you working in 4 or 5? In FD5 they changed the medium to 1024 and below. Which is sad, as some content would fit side by side on 1024, but fit under eacht other in 768. So you have to add different media querie behaviour for 1024 and 768.
.-(

You commented on Philip Meissner's post about 5 years

Hi, it was also in FD 4, but I can't remember how i solved it. (diferent class-names I guess).
It is still there in FD 5.2.3
But the answer by Lincoln Mitchell helps. no visitor resizes/reloads its browser, he just leaves ...

You commented on Tim Martin's post over 5 years
You commented on Albert's post over 5 years

Hi, derived from the BASIC solution

http://foundation.zurb.com/docs/components/offcanvas.html

as described in other forum threads, put a div class="fixed" around nav

i use not the span-code but a text inside the a-tag, resp a font-icon "LIST"
("size-36" is a class for the icon-size)

<a class="left-off-canvas-toggle" href="#"><i class="step fi-list size-36"></i></a>

and style with

.size-36{color:white !important;}

and your class "main-section" (article or section)
a margin-top 45px or so

also you have to change the padding-top

for the new "f-topbar-fixed"-class in the javascript (first occurance)

 i.add_custom_rule(".f-topbar-fixed { padding-top: "+t.data("height")+"px }"),

change t.data(height) to 0

maybe someone knows more css/js, but this works for me.
There is a glitch when you watch it in landscape mode...someone could fix this..

tom.

Posts Followed

No Content

Following

  • No Content

Followers

  • No Content