FAQ Database Discussion Community


Zurb Foundation tooltip stays on the screen

ember.js,zurb-foundation-5
zurb foundation tooltip stays on the screen after component removal/insertion: http://emberjs.jsbin.com/jutapilune/2/edit There is a number of hacks floating around, but I wonder - maybe Ember community has resolved that issue already? ...

Centering CSS using Zurb Foundation CSS Framework

html,css,css3,zurb-foundation-5
I am having a hard time centering all the elements on my site. I'm using Foundation CSS and on the documentation page, they were able to center some text. I copied the same css onto my page but as you can see, nothing on the page is centered. This is...

Foundation 5 table with horizontal scroll bar

css,zurb-foundation-5
I was wondering if Zurb Foundation has a fix in table with many columns. Apparently, 3 to 6 columned table will still be responsive... but my table has 12 columns. And I thought that the framework will put the scroll bars to the table. But my problem is, it does...

Custom grid in foundation?

sass,zurb-foundation,zurb-foundation-5
I need a different sized grid within the standard grid layout. I'm using sass and have tried: .row-30{ @include grid-row($total-columns: 30); } Here's the HTML: <div class="row-30"> <div class="small-5 columns">a 5 col</div> <div class="small-1 columns end">a 1 col</div> </div> I'm having no luck though. Where am I going wrong with...

No route matches [GET] “/js/vendor/jquery.js”

javascript,jquery,ruby-on-rails,zurb-foundation-5
I'm getting the following error, but my server is still running and I don't get an error page rendered. I came across this while attempting to troubleshoot Foundation 5 top-bar drop-down (which won't display). I'm very new to Rails and the like. Please play nice. :) Started GET "/js/vendor/jquery.js" for...

Zurb foundation can't focus input field inside modal

html5,input,modal-dialog,zurb-foundation,zurb-foundation-5
I am trying to set the focus of an input field inside my form when I reveal a modal using ZURB Foundation framework. I am really truly sorry if this question has been asked before I've been having problems finding a solution to this for a while. This is what...

how to have multiple inputs on left side of row and one on the right in foundation 5

html,html5,grid-layout,zurb-foundation-5
How do I move the City, State and Zipcode inputs up where they should be? I have been messing around with the rows and the end, pull, push and offset classes but i guess i haven't found the right combination. Any help will be great. Thanks! My Modal HTML:...

How to explicitly include Foundation 5 child scripts in Bower/Grunt?

javascript,gruntjs,yeoman,bower,zurb-foundation-5
Fairly new to the front-end build system and I am tooling around in a Yeoman generated angular rigged site. It uses Gruntfile.js to include bower.json which declares the following - note that I added Foundation and it's dependencies: { "name": "mercurysocialclub", "version": "0.0.0", "dependencies": { "angular": "^1.3.0", "angular-animate": "^1.3.0", "angular-cookies":...

RegEx string compatible with .NET for currency

javascript,regex,zurb-foundation-5
I've seen a few questions about Regex so far, and some were very helpful, but I'm having some trouble getting the result that I need... One of the questions that has helped me learn a lot is this one: Regular expression to match numbers with or without commas and decimals...

Foundation Modal semi-transparent background cuts off

jquery,css,modal-dialog,zurb-foundation,zurb-foundation-5
Okay so here is the demo site: http://hayati.yahyauddin.com/ To see the modal, hover over a product and click the zoom button to display the quick view for the product. If you continue scrolling down, you will see that the Gray semi-transparent background stops. This problem occurs regardless of screen size!...

Button style in top bar in Foundation?

css,zurb-foundation,zurb-foundation-5
Is it possible in Zurb Foundation to have a normal button in the top bar menu items? Here is an example: The black button is what I'm trying to accomplish. Here is what the HTML currently looks like: <div class="contain-to-grid"> <nav class="top-bar" data-topbar="" role="navigation"> <ul class="title-area"> <li class="name"> <h1> <a...

upgrading ruby on OSX 10.7 for zurb foundtion

ruby-on-rails,ruby,osx,zurb-foundation-5
Hi guys been trying to get zurb foundation installed on my system again unfortunately im having issues. Im running OSX 10.7 because i have an older system and had to wipe after i installed yosemti mistakenly, before I had 10.8 and didn't seem to be having issues. It seems like...

CSS placing image by a form

html,css,ruby-on-rails,zurb-foundation-5
I want an image to appear right beside a form. This is what I am have tried. CSS file: .il { display:inline; padding: 0px; margin: 0px; } new.html.erb <div class="il"> <%= image_tag("successful_forex_trader.jpg", :alt => "Forex Money Manager") %> <div class="small-6 large-centered columns"> <%= form_for(@investor) do |f| %> <%= render 'shared/error_messages',...

Increase fonts for mobile devices with Zurb Foundation

css,mobile,fonts,responsive-design,zurb-foundation-5
I've created a clean new web project with Zurb Foundation 5. On desktop and laptop it looks great. I use rem units for font sizes. On small devices the layout is responsive but the font is much smaller - I guess because of higher pixel density. The solutions (this for...

When using Libsass/Grunt is there a way to watch files on the fly?

css,sass,gruntjs,zurb-foundation-5,libsass
I have installed Foundation 5 using >gem install foundation And then creating a new project using the command >foundation scratch --libsass The main reason being is that I'm on Windows and I really don't need/want to be using compass. I know that after I make changes to my sass files...

Multiple emails in Foundation 5 feedback form

php,contact-form,zurb-foundation-5
I'm very much a beginner, but I've managed to put together a feedback form for my website. The problem I'm having is that the form is sending 2 emails rather than 1. Any thoughts on what is causing this? $('#myForm') .on('valid.fndtn.abide', function () { var name = $("input#name").val(); var email...

Contact form returning blank email

php,zurb-foundation-5
My Foundation 5 contact form is returning blank emails for some reason. The javascript is correct but I can't see anything wrong with my PHP file. What am I doing wrong? Here's the PHP: <?php $name = $_POST["t_name"]; $email = $_POST["t_email"]; $message = $_POST["t_message"]; $msg = " Name: $name Email:...

weird positioning top bar zurb foundation 5

html,css,zurb-foundation,zurb-foundation-5
Hi guys so a site I've been working on is acting up and has randomly re-positioined itself wierdly on the top bar and I have no idea why. I thought everything was fine before, however recently I saw the site and it just so happened that theres a wierd space...

using Zurb Foundation with wordpress no conflict

jquery,wordpress,zurb-foundation-5
I am currently developing a custom theme using foundation and _s I had a few questions.I have followed this tutorial Here enqued all my script etc and now its working. My only concern is the jquery, on some forums is says that i have to deregister the jquery and then...

Data-Equalizer Foundation 5 not working

html,css,zurb-foundation-5
I tried to use these data-equalizer on the foundation framework to be able to have the same height for each column and, from that, be able to center vertically a text in this column. Here is the HTML: <div class="row" data-equalizer> <div class="small-2 columns" data-equalizer-watch style="background: #ff0000;"> <span>Monday:</span> </div> <div...

Rails 4: HTML Code Inside Link_to

ruby,ruby-on-rails-4,zurb-foundation,zurb-foundation-5
On the output I'd like to have this: <%= link_to '&pound;', '#' %> to show: £ I wish not to input "£" as is, I need to input the html code for £. Is there a way? I'm trying to accomplishe this: http://foundation.zurb.com/docs/components/alert_boxes.html...

Zurb Foundation grid or block grid not working with vertical tabs

html,tabs,grid,zurb-foundation,zurb-foundation-5
I have a set of vertical tabs, and when I try and nest in some grid or block grid elements everything seems to overflow outside of the element i.e the 1,2,3 should be in the right section of the below image <div class="row"> <div class="medium-8 columns"> <ul class="tabs vertical" data-tab>...

Zurb Foundation adjust topbar dropdown height

css3,sass,zurb-foundation,zurb-foundation-5
I have adjusted the height of topbar within _topbar.scss to 76 though this also seems to be affecting the dropdown // Height and margin $topbar-height: rem-calc(76) !default; I have changed around 430 to the following, which reduces the height of the dropdown, but then pushes the top margins out on...

Cascade abide forms

javascript,validation,zurb-foundation,zurb-foundation-5
I am trying to use abide data validator with few success. I even do not succeed to have it working. I have a main page on which all the necessary javascript is called (including foundation and foundation.abide) and on this page, on user interaction, I call a "slidedown popup" for...