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
-~----------~----~----~----~------~----~------~--~---
