subject:"Re\: \[css\-d\] Flexbox question"

Re: [css-d] Flexbox question

2017-04-26 Thread Tom Livingston

I think he may have recently changed the site design as well. I don't
remember that left side nav before.



On Wed, Apr 26, 2017 at 7:08 AM Nancy Johnson <njohnso...@gmail.com> wrote:

> I found it very helpful.  I was only looking for syntax to plug into
> my page fast. It provided that. I didn't need to look at their layout
> other than to see if it solved my problem.
>
> Nancy
>
> On Tue, Apr 25, 2017 at 10:24 PM, Tom Livingston <tom...@gmail.com> wrote:
> > I think his breakoints aren't quite right for that 3-column layout.
> > The site itself is very useful and informative.
> >
> > On Tue, Apr 25, 2017 at 9:04 PM, Chris F.A. Johnson
> > <ch...@cfajohnson.com> wrote:
> >> On Tue, 25 Apr 2017, crestchristop...@gmail.com wrote:
> >>
> >>> What is that image ? I know what it is but it appears as junk ?
> >>
> >>
> >> It's a screenshot of the page in question.
> >>
> >>
> >>>
> >>> Christopher
> >>>
> >>> From: Chris F.A. Johnson
> >>> Sent: Tuesday, April 25, 2017 7:57 PM
> >>> To: CSS Discussion Group
> >>> Subject: Re: [css-d] Flexbox question
> >>>
> >>> On Tue, 25 Apr 2017, Nancy Johnson wrote:
> >>>
> >>>> In the past I used it only for equal heights only but there is a great
> >>>> deal I am learning about.  It is a very powerful tool.
> >>>> You do have to be careful for older browsers and have a fall back for
> >>>> those.
> >>>>
> >>>> This link has been very helpful for me
> >>>> https://css-tricks.com/snippets/css/a-guide-to-flexbox/
> >>>
> >>>
> >>> Not a page I'd use as a good example: http://b.cfaj.ca/flex.jpg
> >>>
> >>>
> >>
> >> --
> >> Chris F.A. Johnson, <http://cfajohnson.com>
> >> __
> >> css-discuss [css-d@lists.css-discuss.org]
> >> http://www.css-discuss.org/mailman/listinfo/css-d
> >> List wiki/FAQ -- http://css-discuss.incutio.com/
> >> List policies -- http://css-discuss.org/policies.html
> >> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
> >
> >
> >
> > --
> >
> > Tom Livingston | Senior Front End Developer | Media Logic |
> > ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com
> >
> >
> > #663399
> > __
> > css-discuss [css-d@lists.css-discuss.org]
> > http://www.css-discuss.org/mailman/listinfo/css-d
> > List wiki/FAQ -- http://css-discuss.incutio.com/
> > List policies -- http://css-discuss.org/policies.html
> > Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>
-- 

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Flexbox question

2017-04-26 Thread Nancy Johnson

I found it very helpful.  I was only looking for syntax to plug into
my page fast. It provided that. I didn't need to look at their layout
other than to see if it solved my problem.

Nancy

On Tue, Apr 25, 2017 at 10:24 PM, Tom Livingston <tom...@gmail.com> wrote:
> I think his breakoints aren't quite right for that 3-column layout.
> The site itself is very useful and informative.
>
> On Tue, Apr 25, 2017 at 9:04 PM, Chris F.A. Johnson
> <ch...@cfajohnson.com> wrote:
>> On Tue, 25 Apr 2017, crestchristop...@gmail.com wrote:
>>
>>> What is that image ? I know what it is but it appears as junk ?
>>
>>
>> It's a screenshot of the page in question.
>>
>>
>>>
>>> Christopher
>>>
>>> From: Chris F.A. Johnson
>>> Sent: Tuesday, April 25, 2017 7:57 PM
>>> To: CSS Discussion Group
>>> Subject: Re: [css-d] Flexbox question
>>>
>>> On Tue, 25 Apr 2017, Nancy Johnson wrote:
>>>
>>>> In the past I used it only for equal heights only but there is a great
>>>> deal I am learning about.  It is a very powerful tool.
>>>> You do have to be careful for older browsers and have a fall back for
>>>> those.
>>>>
>>>> This link has been very helpful for me
>>>> https://css-tricks.com/snippets/css/a-guide-to-flexbox/
>>>
>>>
>>> Not a page I'd use as a good example: http://b.cfaj.ca/flex.jpg
>>>
>>>
>>
>> --
>> Chris F.A. Johnson, <http://cfajohnson.com>
>> __
>> css-discuss [css-d@lists.css-discuss.org]
>> http://www.css-discuss.org/mailman/listinfo/css-d
>> List wiki/FAQ -- http://css-discuss.incutio.com/
>> List policies -- http://css-discuss.org/policies.html
>> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>
>
>
> --
>
> Tom Livingston | Senior Front End Developer | Media Logic |
> ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com
>
>
> #663399
> __
> css-discuss [css-d@lists.css-discuss.org]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Flexbox question

2017-04-25 Thread Tom Livingston

I think his breakoints aren't quite right for that 3-column layout.
The site itself is very useful and informative.

On Tue, Apr 25, 2017 at 9:04 PM, Chris F.A. Johnson
<ch...@cfajohnson.com> wrote:
> On Tue, 25 Apr 2017, crestchristop...@gmail.com wrote:
>
>> What is that image ? I know what it is but it appears as junk ?
>
>
> It's a screenshot of the page in question.
>
>
>>
>> Christopher
>>
>> From: Chris F.A. Johnson
>> Sent: Tuesday, April 25, 2017 7:57 PM
>> To: CSS Discussion Group
>> Subject: Re: [css-d] Flexbox question
>>
>> On Tue, 25 Apr 2017, Nancy Johnson wrote:
>>
>>> In the past I used it only for equal heights only but there is a great
>>> deal I am learning about.  It is a very powerful tool.
>>> You do have to be careful for older browsers and have a fall back for
>>> those.
>>>
>>> This link has been very helpful for me
>>> https://css-tricks.com/snippets/css/a-guide-to-flexbox/
>>
>>
>> Not a page I'd use as a good example: http://b.cfaj.ca/flex.jpg
>>
>>
>
> --
> Chris F.A. Johnson, <http://cfajohnson.com>
> __
> css-discuss [css-d@lists.css-discuss.org]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/



-- 

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Flexbox question

2017-04-25 Thread Chris F.A. Johnson


On Tue, 25 Apr 2017, crestchristop...@gmail.com wrote:


What is that image ? I know what it is but it appears as junk ?


It's a screenshot of the page in question.



Christopher

From: Chris F.A. Johnson
Sent: Tuesday, April 25, 2017 7:57 PM
To: CSS Discussion Group
Subject: Re: [css-d] Flexbox question

On Tue, 25 Apr 2017, Nancy Johnson wrote:


In the past I used it only for equal heights only but there is a great
deal I am learning about.  It is a very powerful tool.
You do have to be careful for older browsers and have a fall back for those.

This link has been very helpful for me
https://css-tricks.com/snippets/css/a-guide-to-flexbox/


Not a page I'd use as a good example: http://b.cfaj.ca/flex.jpg




--
Chris F.A. Johnson, <http://cfajohnson.com>
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Flexbox question

2017-04-25 Thread crestchristopher

What is that image ? I know what it is but it appears as junk ?

Christopher

From: Chris F.A. Johnson
Sent: Tuesday, April 25, 2017 7:57 PM
To: CSS Discussion Group
Subject: Re: [css-d] Flexbox question

On Tue, 25 Apr 2017, Nancy Johnson wrote:

> In the past I used it only for equal heights only but there is a great
> deal I am learning about.  It is a very powerful tool.
> You do have to be careful for older browsers and have a fall back for those.
>
> This link has been very helpful for me
> https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Not a page I'd use as a good example: http://b.cfaj.ca/flex.jpg

-- 
Chris F.A. Johnson, <http://cfajohnson.com>
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Flexbox question

2017-04-25 Thread Chris F.A. Johnson


On Tue, 25 Apr 2017, Nancy Johnson wrote:


In the past I used it only for equal heights only but there is a great
deal I am learning about.  It is a very powerful tool.
You do have to be careful for older browsers and have a fall back for those.

This link has been very helpful for me
https://css-tricks.com/snippets/css/a-guide-to-flexbox/


Not a page I'd use as a good example: http://b.cfaj.ca/flex.jpg

--
Chris F.A. Johnson, 
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Flexbox question

2017-04-25 Thread Nancy Johnson

In the past I used it only for equal heights only but there is a great
deal I am learning about.  It is a very powerful tool.
You do have to be careful for older browsers and have a fall back for those.

This link has been very helpful for me
https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Nancy

On Sat, Apr 22, 2017 at 2:10 AM,  <crestchristop...@gmail.com> wrote:
> Interesting method of using FlexBox; for someone whom has never used Flexbox 
>
> Christopher
>
> From: Tom Livingston
> Sent: Monday, April 10, 2017 5:40 PM
> To: CSS Discussion Group
> Subject: Re: [css-d] Flexbox question
>
> On Mon, Apr 10, 2017 at 5:24 PM, Al Sparber <aspar...@roadrunner.com> wrote:
>
>> On 4/10/2017 4:01 PM, Tom Livingston wrote:
>>
>>> List,
>>>
>>> I haven't used flex at all basically, but have an opportunity to.
>>>
>>> I have rows of 3 items. I would like them evenly spaced, but if the last
>>> row has only 2 items, I'd like the same amount of space between but I want
>>> them aligned to the left (like text-align:left). I can't seem to get this.
>>> Is it possible? I've gotten close, but last two items are far left and far
>>> right.
>>>
>>
>> See if you can work with this:
>> http://www.projectseven.com/csslab/flexbox/tom-cssd/
>> It's all in the head.
>>
>>
>
> This looks good. I think I might be able to run with this. Thanks Al.
>
> Seems like the key to what I was after was  flex-direction: column (as
> opposed to row) - to keep the last two items to the left.
>
> Thanks again.
>
>
> --
>
> Tom Livingston | Senior Front End Developer | Media Logic |
> ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com
>
>
> #663399
> __
> css-discuss [css-d@lists.css-discuss.org]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>
> __
> css-discuss [css-d@lists.css-discuss.org]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Flexbox question

2017-04-22 Thread crestchristopher

Interesting method of using FlexBox; for someone whom has never used Flexbox 

Christopher

From: Tom Livingston
Sent: Monday, April 10, 2017 5:40 PM
To: CSS Discussion Group
Subject: Re: [css-d] Flexbox question

On Mon, Apr 10, 2017 at 5:24 PM, Al Sparber <aspar...@roadrunner.com> wrote:

> On 4/10/2017 4:01 PM, Tom Livingston wrote:
>
>> List,
>>
>> I haven't used flex at all basically, but have an opportunity to.
>>
>> I have rows of 3 items. I would like them evenly spaced, but if the last
>> row has only 2 items, I'd like the same amount of space between but I want
>> them aligned to the left (like text-align:left). I can't seem to get this.
>> Is it possible? I've gotten close, but last two items are far left and far
>> right.
>>
>
> See if you can work with this:
> http://www.projectseven.com/csslab/flexbox/tom-cssd/
> It's all in the head.
>
>

This looks good. I think I might be able to run with this. Thanks Al.

Seems like the key to what I was after was  flex-direction: column (as
opposed to row) - to keep the last two items to the left.

Thanks again.


-- 

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Flexbox question

2017-04-10 Thread Al Sparber


See if you can work with this:
http://www.projectseven.com/csslab/flexbox/tom-cssd/
It's all in the head.




This looks good. I think I might be able to run with this. Thanks Al.

Seems like the key to what I was after was  flex-direction: column (as
opposed to row) - to keep the last two items to the left.


Actually, it's a combination of "grow" being set to zero and the 
flex-basis (suggested width). The default position for a flexbox element 
is left. Study up on inline-flex too as that opens the door to vertical 
positioning options.



Thanks again.


NP.

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Flexbox question

2017-04-10 Thread Tom Livingston

On Mon, Apr 10, 2017 at 5:24 PM, Al Sparber  wrote:

> On 4/10/2017 4:01 PM, Tom Livingston wrote:
>
>> List,
>>
>> I haven't used flex at all basically, but have an opportunity to.
>>
>> I have rows of 3 items. I would like them evenly spaced, but if the last
>> row has only 2 items, I'd like the same amount of space between but I want
>> them aligned to the left (like text-align:left). I can't seem to get this.
>> Is it possible? I've gotten close, but last two items are far left and far
>> right.
>>
>
> See if you can work with this:
> http://www.projectseven.com/csslab/flexbox/tom-cssd/
> It's all in the head.
>
>

This looks good. I think I might be able to run with this. Thanks Al.

Seems like the key to what I was after was  flex-direction: column (as
opposed to row) - to keep the last two items to the left.

Thanks again.


-- 

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Flexbox question

2017-04-10 Thread Al Sparber


On 4/10/2017 4:01 PM, Tom Livingston wrote:

List,

I haven't used flex at all basically, but have an opportunity to.

I have rows of 3 items. I would like them evenly spaced, but if the last
row has only 2 items, I'd like the same amount of space between but I want
them aligned to the left (like text-align:left). I can't seem to get this.
Is it possible? I've gotten close, but last two items are far left and far
right.


See if you can work with this:
http://www.projectseven.com/csslab/flexbox/tom-cssd/
It's all in the head.

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Flexbox question

2017-04-10 Thread Tom Livingston

Hmm. A bit hack-y, but interesting thought. I'll tuck that away. ;-)

On Mon, Apr 10, 2017 at 4:37 PM, Karl DeSaulniers 
wrote:

> Hey Tom,
> Can you create a blank one that fills in for the third that you can then
> space from?
>
> Best,
>
> Karl DeSaulniers
> Design Drumm
> http://designdrumm.com
>
>
>
>
> > On Apr 10, 2017, at 3:01 PM, Tom Livingston  wrote:
> >
> > List,
> >
> > I haven't used flex at all basically, but have an opportunity to.
> >
> > I have rows of 3 items. I would like them evenly spaced, but if the last
> > row has only 2 items, I'd like the same amount of space between but I
> want
> > them aligned to the left (like text-align:left). I can't seem to get
> this.
> > Is it possible? I've gotten close, but last two items are far left and
> far
> > right.
> >
> > Thanks!
> >
> >
> >
> > --
> >
> > Tom Livingston | Senior Front End Developer | Media Logic |
> > ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com
> >
> >
> > #663399
> > __
> > css-discuss [css-d@lists.css-discuss.org]
> > http://www.css-discuss.org/mailman/listinfo/css-d
> > List wiki/FAQ -- http://css-discuss.incutio.com/
> > List policies -- http://css-discuss.org/policies.html
> > Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>
> __
> css-discuss [css-d@lists.css-discuss.org]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/




-- 

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Flexbox question

2017-04-10 Thread Karl DeSaulniers

Hey Tom,
Can you create a blank one that fills in for the third that you can then space 
from?

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com




> On Apr 10, 2017, at 3:01 PM, Tom Livingston  wrote:
> 
> List,
> 
> I haven't used flex at all basically, but have an opportunity to.
> 
> I have rows of 3 items. I would like them evenly spaced, but if the last
> row has only 2 items, I'd like the same amount of space between but I want
> them aligned to the left (like text-align:left). I can't seem to get this.
> Is it possible? I've gotten close, but last two items are far left and far
> right.
> 
> Thanks!
> 
> 
> 
> -- 
> 
> Tom Livingston | Senior Front End Developer | Media Logic |
> ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com
> 
> 
> #663399
> __
> css-discuss [css-d@lists.css-discuss.org]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Flexbox question

Re: [css-d] Flexbox question

Re: [css-d] Flexbox question

Re: [css-d] Flexbox question

Re: [css-d] Flexbox question

Re: [css-d] Flexbox question

Re: [css-d] Flexbox question

Re: [css-d] Flexbox question

Re: [css-d] Flexbox question

Re: [css-d] Flexbox question

Re: [css-d] Flexbox question

Re: [css-d] Flexbox question

Re: [css-d] Flexbox question

13 matches

Site Navigation

Mail list logo

Footer information