problems with elastic

2 views
Skip to first unread message

jujarven

unread,
Sep 2, 2009, 4:43:08 PM9/2/09
to Elastic CSS Framework
Hello,

FIrst of all, thanks for putting effort on Elastic. It has good ideas
which I like and simplicity is never a bad thing.

However, I don't seem to get elastic to work properly. I.e. the
examples in your homepage documentation, if I use them at blank doc
and test with IE8, they don't work at all. In chrome they work fine
mostly, and also on Safari. I started to also wonder, what I am doing
wrong, for example, do you see some error on this code:

<div class="unit on-4 columns">
<div class="container same-height" style="width:960px;">
<div class="fixed column" style="width:240px;">
<div class="txt4">first column first column first column first
column first column first column first column first column</div>
</div>
<div class="fixed column" style="width:240px;">
<div class="txt4">second column second column second column second
column second column second column second column</div>
</div>
<div class="fixed column" style="width:240px;">
<div class="txt4">third third third third third third third third
third third third third third third third third third </div>
</div>
<div class="fixed column" style="width:240px;" >
<div class="txt4">4th very long text here 4th very long text here
4th very long text here 4th very long text here 4th very long text
here 4th very long text here 4th very long text here 4th very long
text here 4th very long text here 4th very long text here 4th very
long text here 4th very long text here</div>
</div>
</div>
</div>

It does display 4 columns with correct width, and also applying the
nested elements (only padding in class .txt4), but same-height does
not apply --> if I use background colour columns are not the same
height.

Where I am doing the mistake? Header should be fine, it has jQuery and
all three elastic related files loaded. Latest version of elastic
2.0.1 and 1.3.2 of jQuery.

Thanks in advance.

Javier Andrés Ayala Araujo

unread,
Sep 2, 2009, 5:05:49 PM9/2/09
to elastic-cs...@googlegroups.com
Hi Jujarven,

Your code is fine, the thing with same-height is that it will give the
same height but just to its childs.

For example, in your case the direct childs of the same-height are all
the fixed column inside the container. I'm supposing that you are
using the background-color in the <div class="txt4">, so you can try
adding a full-height helper like this --> <div class="txt4 full-
height">. This will force the div to have the same height of it's
parent.

That of course is one approach, you can also get rid of the <div
class="txt4">, apply the bg-color to the fixed column (just remember
you can't add paddings, margins or borders to columns, that's why -
containers- exists.)

Hope this can help you.
Thanks for using Elasticss.

------
Elasticss Core Team

jujarven

unread,
Sep 2, 2009, 5:24:58 PM9/2/09
to Elastic CSS Framework
Hi Javier,

I tried, and both your helpful comments worked.

I decided to use full-height solution. Is there some drawback using it
compared to applying background color directly to fixed column?

1000 * thanks to you for help - and really quick help!

P.S. I notified why your homepage examples didn't work on my IE8. For
some reason, the download link in your homepage gave me version 2.0 of
the framework. SO I downloaded the 2.0.1 and now the examples started
to work.

Jujarven


On 3 syys, 00:05, Javier Andrés Ayala Araujo <jav.for...@gmail.com>
wrote:

Sergio de la Garza

unread,
Sep 2, 2009, 5:26:34 PM9/2/09
to Elastic CSS Framework
Hi Jujarven,

Also I encourage you to use a container after a column for example
<div class="column fixed" style="width:200px;">
<div class="container txt4 full-height">
....
</div>
</div>

where txt4 is the class with the style-skin of the container.

Also if you're using just fixed columns you don't need to specify
"on-4" since Elastic will not do any column width calculation, same
goes for unit, you don't need that since Elastic knows that a
"columns" class is a unit also.

Hope this helps.

Cheers


------------------------------------------
http://myupdated.info/sgarza

Fernando Trasviña

unread,
Sep 2, 2009, 5:28:59 PM9/2/09
to elastic-cs...@googlegroups.com
Very well we will change the link on the page to go to the latest
version, and try to check what is going on on version 2

Jawks(Javier) is the maintainer of the site and he shall fix it soon

PD. hi jawks lets have some beers
Reply all
Reply to author
Forward
0 new messages