That is a good question..
I also do as lockheartmac:
#contents { padding: 0 10px;}
If you use append the space is too wide (40px), so it won't work well.
Using one less column and adding padding is the only way to go in my
opinion.
On Oct 6, 3:49 pm, lockheartmac <[email protected]> wrote:
> I would agree that adding padding is a bad idea. The append class is a
> good way to add spaces between columns. The added space will be the
> size of the initial single column width, e.g., 40 pixels using the
> default blueprint settings.
>
> <div class="container showgrid">
> <div class="column first span-15 append-1"></div>
> <div class="column last span-8"></div>
> </div>
>
> The code above will create the idea I'm trying to express with as few
> divs as possible.
>
> I don't try to add padding to many columns, but when the need does
> arise, I use something like this:
>
> <div class="container showgrid">
> <div id="contents" class="column first span-15"></div>
> <div class="column last span-8"></div>
> </div>
>
> #contents {
> padding-left: 20px;
> padding-right: 20px;
>
> }
>
> What you can see here is I have purposely made the total span of the
> column equal to less than 24 total. Were this a single column, it
> would look like a span-23. That final span's width (40px) then gets
> added to the column div#contents as left and right padding. So while
> the markup doesn't total 24 columns, that compute width will be equal
> to 24. Hope this helps!
>
> On Oct 4, 8:15 am, "Codemaster.Snake" <[email protected]>
> wrote:
>
>
>
> > Hi All!
>
> > I have been using blueprint for quiet a while now.
>
> > But It seems that I should look for better alternative to my problem.
> > Well I have a question about padding of grid elements.
>
> > Well following is a sample code
>
> > <div class='container'>
> > <div class='span-24 last'>
> > <div class='span-20'>
> > <h1>Heading</h1>
> > <p>Some random text</p>
> > </div>
> > <div class='span-4 last'>
> > </div>
> > </div>
> > </div>
>
> > Now when I see this in browser, there is no padding between div border-
> > left and h1 or p. I used to solve this problem by adding one more div
> > in every grid element.
>
> > Also, If I have to use a nested grid inside the first child grid then
> > the problem arises. Since I used to add a div inside parent to apply
> > padding, there's no way left for me to add more grid elements inside.
>
> > I am sure many of you must have faced this problem, What do you guys
> > do the overcome it?
>
> > Thanks
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Blueprint CSS" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/blueprintcss?hl=en
-~----------~----~----~----~------~----~------~--~---
