Margin Stack / Question


#1

Hi,

I am using the margin stack frequently. But it is not always the best solution to define paddings and/or margins for the different breakpoints. Instead, I would love to add a percentage for each breakpoint, e.g.:

Desktop: 50%
Tablet: 50%
Phone. 70%

Especially banner images and content can be scaled easy and efficiently this way.

What do you think?

Thanks,

Jan


#2

That isn’t something I’m looking to do for the Margins stack. The Margins stack is about dealing with margins and padding around elements and not percentage based widths. For me they are two separate things. Could it be a possible separate stack for a future update though? Perhaps.

That being said, look at using the Container stack to set max-widths.


#3

@Fuellemann You can of course do exactly that with the BWD BluePrintONE stack which has 3 breakpoint ranges for width, padding and margin in px and % (and many others).


#4

True - I have it and did not look :slight_smile: Thanks!


#5

It is well worth learning about all of the features as it is a massively capable stack.


#6

Yes, still I wish for a bit more option within Foundry. The BWD stacks can be too much and take sometimes quite some time to establish the desired function. It would be great if Adam will add some of these “Pro” features to his stacks in general. Like Percentages :slight_smile:


#7

That’s the dilemma faced by RapidWeaver stack designers. At least there are multiple solutions available.


#8

It is not a matter of it being a “pro” feature or not – it is just a different method of measurement…

In your original post you asked about adding a percentage based width function to the Margins stack – if I understood correctly – which I assumed I did since you marked the post as solved after I replied. The Margins stack does not handle widths, but handles margins and padding for stacks enclosed within it, as I mentioned in my previous post.

I chose a particular path to go down for widths though, which is to use the Container stack to handle setting the width of its contained elements either using a Fluid or Fixed (Max-Width) setting measured in pixels. This is how Bootstrap is setup for the most part.

You mention that the BWD stacks often take a lot of time to setup to get a desired result. This is from having a huge number of settings within each stack. This is something I avoid, where I can… this is why I chose one particular method of determining the width of the content within the Container. For now that is how it will remain.

I mentioned above that a percentage based width setting might be an idea for a future stack. I will keep that in mind and put it on the issue tracker where I keep track of bugs and feature requests. It isn’t a promise to get it in, but I have taken note of it.


#9

Indeed I am more than happy with Foundry and your approach. I used the Container Max-Width and added some Margin so it looks nice on mobile as well. And I am glad that you do NOT have these tons of features like BWD.

Since I am working with Foundry every single day now, there are always some slight areas I see improvement possibilities and it is a good way to discuss them here. Most of the times, you have a good workaround or convincing reasons not to implement them.

Things like, I would love to have the scroll down button animated. Or to set the divider to embossed. Or to have the muted text in the header to be placed on a second line. For the overlap to lap over right or left as well…

But as you see, only a very good product which is frequently in use gets these thoughts about improvements in details. So you do everything right and I am looking for the further updates of Foundry!

Thanks again,

Jan


#10

I want to add my 2cents to that topic:
Similar to Jan, I am most likely to use foundry for everyday work, because it is just the easiest way to achieve great looking results whithout getting stressed by zillions of options. it just works out of the box!

Every now and then I stumble upon a detail where I think “why can I not do this”, “why is foundry setting this limit”, why isn´t there an option for…“
But that is part of the magic, I guess. And I have tons of respect towards adam, because he keeps on track with his philosophy to keep things simple, although it might be seductive as a developer to „collect features” in his products just to satisfy the yelling user-base.

On the other hand I am blown away by the detail-ness and unlimit-ness that BWD stacks often offer to RW web design - although I hardly understand half of what the available stack settings are good for :wink:
Sometimes it´s just frustrating that something that should work does not work as intended, just because it is too complicated to set it up correctly (missing checkbox marked, wrong option in a pull down etc.)
maybe that is just the nature of the BWD stacks, maybe it´s because english isn´t my mother tongue, maybe it´s because the BWD documentation is not as well prepared than the documentation that adam delivers with his product (again: simple and clear)

for me, the conclusion is: we as designers should be really happy to have the best of both worlds at our hands: the eazypeazy-thing and the nerd-thing.
I encourage Adam to always take care of keeping the balance between features and simplicity, as well as Andrew shall always focus on giving us the extra little bit fine tuning capabilities.
Amen!