Menu icon Foundation

My Posts

No Content

My Comments

Dave commented on marc's post about 5 years

What's your code look like so far?

On this forum at least the width stretches across the entires screen. On your own code, you'll want to stop that from happening at some point, by setting a max-width on your container.

Without seeing your code, basically we can do that with a wrapper div around the entire site:

<div class="wrapper">
<!-- foundation stuff starts here-->
<div class="row">
<div class="whatever-xx columns">
<p>Content</p>
</div>
</div>
</div>

Then make sure your wrapper is styled with a white background so it overrides the default background and get the whole content wrapper centered:

body { background-color:#000; }

.wrapper { max-width: 62.5em; margin: 0 auto;  background-color:#fff;color:#000; }

There's more to it than that but it sounds like you may want to brush up on your HTML and CSS a bit before jumping into something like Foundation, that'd be my advice to beginners at least.

Dave commented on James Van Waza's post about 5 years

Looks like that version in the CDNJS library isn't the full javascript build.

You need the top bar component to make it work:

http://cdnjs.cloudflare.com/ajax/libs/foundation/5.4.6/js/foundation/foundation.topbar.min.js

Or, alternatively switch out the main JS file for one that includes the full build like Rafi's:

 http://cdn.foundation5.zurb.com/foundation.js

For some reason the combined version on the cloudflare CDN isn't minified at all.

http://cdnjs.cloudflare.com/ajax/libs/foundation/5.4.6/js/foundation.min.js

... even though it's labeled as it is. Might be a bug in the distribution?

Dave commented on Dana Suslovich Rabl's post almost 6 years

What Brandon said will work but depending on the look you're going for—for example the default Zurb flat style— you could do it without any bg images at all using the css triangles technique. Chris Coyier cooked up a nice explanation that can get you started but it's useful for all sorts of things -> http://css-tricks.com/animation-css-triangles-work/

Dave commented on Pierre MARTIN's post almost 6 years

Same issue. Looks like it affects iOS 7 as well.

Dave commented on Brad Graham's post almost 6 years

From the Docs (http://foundation.zurb.com/docs/sass.html) did you try:

cd MY_PROJECT foundation update 

You'll want to have the latest gems along with git, bower, nodejs, etc.

Dave commented on James Cocker's post almost 6 years

I got Orbit working by changing that line to:

        return this.libs[lib].init.apply(this.libs[lib]);

... basically remove args as the second parameter there. I haven't tested anything else but this is using jQuery 1+.

Posts Followed

No Content

Following

    No Content

Followers

My Posts

No Content

My Comments

You commented on marc's post about 5 years

What's your code look like so far?

On this forum at least the width stretches across the entires screen. On your own code, you'll want to stop that from happening at some point, by setting a max-width on your container.

Without seeing your code, basically we can do that with a wrapper div around the entire site:

<div class="wrapper">
<!-- foundation stuff starts here-->
<div class="row">
<div class="whatever-xx columns">
<p>Content</p>
</div>
</div>
</div>

Then make sure your wrapper is styled with a white background so it overrides the default background and get the whole content wrapper centered:

body { background-color:#000; }

.wrapper { max-width: 62.5em; margin: 0 auto;  background-color:#fff;color:#000; }

There's more to it than that but it sounds like you may want to brush up on your HTML and CSS a bit before jumping into something like Foundation, that'd be my advice to beginners at least.

You commented on James Van Waza's post about 5 years

Looks like that version in the CDNJS library isn't the full javascript build.

You need the top bar component to make it work:

http://cdnjs.cloudflare.com/ajax/libs/foundation/5.4.6/js/foundation/foundation.topbar.min.js

Or, alternatively switch out the main JS file for one that includes the full build like Rafi's:

 http://cdn.foundation5.zurb.com/foundation.js

For some reason the combined version on the cloudflare CDN isn't minified at all.

http://cdnjs.cloudflare.com/ajax/libs/foundation/5.4.6/js/foundation.min.js

... even though it's labeled as it is. Might be a bug in the distribution?

You commented on Dana Suslovich Rabl's post almost 6 years

What Brandon said will work but depending on the look you're going for—for example the default Zurb flat style— you could do it without any bg images at all using the css triangles technique. Chris Coyier cooked up a nice explanation that can get you started but it's useful for all sorts of things -> http://css-tricks.com/animation-css-triangles-work/

You commented on Pierre MARTIN's post almost 6 years

Same issue. Looks like it affects iOS 7 as well.

You commented on Brad Graham's post almost 6 years

From the Docs (http://foundation.zurb.com/docs/sass.html) did you try:

cd MY_PROJECT foundation update 

You'll want to have the latest gems along with git, bower, nodejs, etc.

You commented on James Cocker's post almost 6 years

I got Orbit working by changing that line to:

        return this.libs[lib].init.apply(this.libs[lib]);

... basically remove args as the second parameter there. I haven't tested anything else but this is using jQuery 1+.

Posts Followed

No Content

Following

  • No Content

Followers

  • No Content