Questions tagged [zurb-foundation]

Foundation is a cross-device CSS framework, maintained by ZURB, for building both prototypes and production code.

ZURB Foundation acts as framework. The latest versions of Foundation offers customization tools to customize the downloaded package of the framework. It is also fully compatible with layouts.

Resources :

View Latest Release | View Releases history


Related tags :

5132 questions
1
vote
1 answer

Foundation 6 slider update on page load

I have a Foundation 6 Slider on an html page I use to setup a device parameters. On page load, I read the parameters from an xml file and I set the page accordingly. Regarding the slider, I modify the input number which is connected via…
peregrinus
  • 147
  • 1
  • 12
1
vote
1 answer

How to display expressions within Foundation Zurb

I am using Yeti Launch and I want to use expressions to display page information on each page. For example, I want to display the page title and some other content specific to that page. So the homepage would be {title: "homepage"} but I can't…
breezy
  • 1,910
  • 1
  • 18
  • 35
1
vote
0 answers

Setting foundation 6 data-accordion-menu dynamically with javascript

I am trying to dynamically build an array within Foundation 6's accordion menu by using pure javascript. I cannot seem to figure out how to inject data-accordion-menu into the div. The original code looks like this:
1
vote
1 answer

How to do 50% / 50% mobile columns and fixed spacing desktop columns using Zurb Foundation?

This may be a typical selection panel, which is on the desktop: and on an mobile phone: Can Zurb Foundation do this? I think one catch is, for medium width and up, the width of the 2 columns are supposed to be fixed, instead of dynamic. (choice 2…
nonopolarity
  • 146,324
  • 131
  • 460
  • 740
1
vote
1 answer

cannot get Foundation menu to work with reactJS

I cant figure out why the following code wont create the foundation menu for me. Below is the super simplified version of my code: var MenuDisplay = React.createClass({ render: function(){ console.log("menu…
user308553
  • 1,238
  • 4
  • 18
  • 32
1
vote
1 answer

Zurb Foundation 6 sticky header and offcanvas menu

I've been scouring the internet looking for a solution to this, but haven't yet found one. I have a site with a sticky header/nav that has a hamburger button to open an off canvas menu. The off-canvas-wrapper wraps everything, including the header.…
bmac
  • 55
  • 8
1
vote
1 answer

How come there is a white gap on the right side of the page when viewing on a mobile device?

I'm finishing up my own companies website using Foundation 5 and it was displaying correctly on a mobile phone up until I started adding the portfolio and pricing sections that are being pulled from a database. When I take those sections off,…
Mike
  • 163
  • 1
  • 3
  • 13
1
vote
1 answer

How to extend columns background outside of grid, while maintaining grid in center of page?

Some time ago, i was hired to create company website. With help of Zurb Foundation Framework, i created site with layout like this: It's just a grid with several rows(for header, main area, and footer), each of which divided to two columns(4 for…
rufanov
  • 3,266
  • 1
  • 23
  • 41
1
vote
1 answer

Zurb Foundation Tooltip background opacity issue

I use Foundation 6 and the tooltip feature. I tried to add z-index: 9999; and opacity:1 to my tooltip class but without any effect.
StandardNerd
  • 4,093
  • 9
  • 46
  • 77
1
vote
0 answers

Mega Menu Dropdowns with Foundation 5 add another sub level

Can someone help me add another sub level to the "Graduate" menu, like in the screenshot below. I have tried a few things, all of which haven't worked. e.g : Graduate ->(on image section graduate 1,graduate 2,graduate 3) CodePen Demo HTML:
Lakmal
  • 779
  • 1
  • 8
  • 16
1
vote
0 answers

Off-canvas menu turn off animation on slide based on condition

Currently I am working on a project that is similar to this example: Off Canvas Menu Example HTML: