[Pro] Box-sizing

I’ve been reading some of the comments about the Box Sizing action breaking under Pro7, and I’m curious about how it’s used and why it behaves the way it seems.

I’m not so much of an actions guy - I do use some very clever ones, but for box-sizing I use the following:

*, *:before, *:after { 
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box; 
	box-sizing: border-box; 
}

I set this as a Tag style in the FWP stylesheet. I also use a style reset (the Meyer Reset, though sometimes a Normalized reset). This method let’s me set the issue for most everything, site wide.

Is the Box Sizing action meant to perform only to applied items? What is the benefit of this?

Also, does the Box Sizing action affect how items appear in FWP’s workspace? My method obviously does not, but I am also undeterred by how the workspace appears.

I’ve not tried FW7 yet, so I’m listening closely to those of you who are.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I’m not so much of an actions guy

Me neither

I do use some very clever ones, but for box-sizing I use the following:

*, *:before, *:after { 
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box; 
	box-sizing: border-box; 
}

Me, too

I set this as a Tag style in the FWP stylesheet. I also use a style reset (the Meyer Reset, though sometimes a Normalized reset). This method let’s me set the issue for most everything, site wide.

Is the Box Sizing action meant to perform only to applied items? What is the benefit of this?

None - except that you don’t need to re-adjust it via extended. This mostly ends up in boxes something 99.998754872% (output) wide.

Also, does the Box Sizing action affect how items appear in FWP’s workspace?

not at all.

My method obviously does not, but I am also undeterred by how the workspace appears.

I’ve not tried FW7 yet, so I’m listening closely to those of you who are.

I elsewhere said:

The only thing the FW7 needs is a workspace which behaves border-box as well. The towers addressed it, but with no date.

But if - it’ll be the golden age of BM.

Cheers

Thomas


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

No action for me either.

There is a school of thought that offers a slight alternative:

html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}

Apparently this is more beneficial if there are components on your page that may be embedded or via plug-ins

David


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

The Box Sizing action does two things:

  1. Applies box-sizing: border-box; to the element that the action is on.
  2. Recalculates and overrides the width that Freeway constrains things to as a result of using padding-box in the design view.

I don’t typically use the Box Sizing action for my projects. However, it is incredibly useful in Backdraft, as Backdraft see’s a lot of use by people who may not understand why resizing a box in Freeway’s design view doesn’t result in a resize in the output (because the width set through the extended dialog is overriding). There is a sacrifice in code cleanliness for the “it just works” effect.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options