zurb-foundation

问题 The top bar nav on my site is left aligned like this: | Home | aveoTSD | Silent Nite | I would like to center the top bar nav like this: | Home | aveoTSD | Silent Nite | Center it exactly like the red bar with "Example" text. Here is my css. 回答1: You can do it by adding this to your CSS (and preferably removing conflicting styles): .top-bar-section ul {display: table; margin: 0 auto;} .top-bar-section ul li {display: table-cell;} 回答2: Found this to be helpful: https://github.com/zurb

问题 I like to achieve this effect for a TYPO3 site navigation - see the codepen here: https://codepen.io/mr_vespa/pen/zYryZQo On load the menu has the first tab highlighted. On click the selected tab will be highlighted. Both effects are not taking place. How to get an "active" class on the first menu tab only why is the js-code not applied both jquery and the js-code are included/ TYPO3 version 9.* The menu code (which is coded for use with Foundation 6.4.2 dropdown menu). and working fine. lib

问题 I added zurb foundation inside my next project and on the sass side I have no problems importing everything. The problems starts when I want to import the JS packages. I'm not entirely sure where the problem might be, the only thing I could understand this passed days is that it may be a webpack importing problem. Here is the index code import { useState, Component } from 'react'; import { connect } from 'react-redux'; import 'resources/main.scss'; import type { State } from 'AppState/Types';

问题 I'm having some issues aligning the call to action buttons in a HTML email I am building for a client. The buttons are appearing off to the left and not filled correctly. This is how they appear in my browser and most email clients: And this is how they appear in Outlook 2016: Here is my Inky markup: <row class="call-to-actions"> <columns small="6"> <spacer size="50"></spacer> <button class="facebook float-right" href="#">Like on Facebook</button> <spacer size="50"></spacer> </columns>

问题 I asked a previous question earlier about flash messages and how to customize them, but I could really use some clarification about what these files are? <script src="js/vendor/jquery.js"></script> <script src="js/foundation/foundation.js"></script> <script src="js/foundation/foundation.alert.js"></script> What are they and why do I need them? Foundation makes it sound as if it was already included.Am I supposed to put code in them, my rails app doesn't have a vendor directory or jquery.js

来源： https://stackoverflow.com/questions/63338489/reveal-modal-is-revealing-last-value-in-loop-iteration-foundation-zurb-issue

来源： https://stackoverflow.com/questions/63369837/model-reveal-issue-with-ajax-call-in-foundation-zurb

来源： https://stackoverflow.com/questions/63369837/model-reveal-issue-with-ajax-call-in-foundation-zurb

问题 I'm using Highcharts within Zurb's Foundation framework for a class project. I have three charts within a section tab. One is within a 12-column div, the other two are on the same row within 6-column divs. When the page loads, the featured chart does not take up the available width of the 12 columns, and the two smaller charts overflow their 6 columns. However, when the window is resized or I try to investigate using Inspect element, the charts immediately snap into the correct dimensions.

问题 I'm using Highcharts within Zurb's Foundation framework for a class project. I have three charts within a section tab. One is within a 12-column div, the other two are on the same row within 6-column divs. When the page loads, the featured chart does not take up the available width of the 12 columns, and the two smaller charts overflow their 6 columns. However, when the window is resized or I try to investigate using Inspect element, the charts immediately snap into the correct dimensions.