Hi,
Adding padding/margin/border disrupts the grid, unless you make sure it adds
multiples of your column+gutter width. Use showgrid on your container to see
what goes and what deosn't.
Also, you can remove the "last" on span-24. Look at the CSS, you'll see they
both remove the right gutter. Like so:
<div class='container'>
<div class='span-24'> <!-- last is useless here -->
<div class='span-20'>
<h1>Heading</h1>
<p>Some random text</p>
</div>
<div class='span-4 last'>
</div>
</div>
</div>
Finally, any div without span-X will fill the entire width of its parent, so
you don't even need to bother with a span-24 in that case.
<div class='container'>
<div class='span-20'> <!-- <div class="span-24"> is useless here -->
<h1>Heading</h1>
<p>Some random text</p>
</div>
<div class='span-4 last'>
</div>
</div>
On Mon, Oct 5, 2009 at 10:57 AM, 娄建文 <[email protected]> wrote:
> Codemaster.Snake wrote:
>
> Hi All!
>
> I have been using blueprint for quiet a while now.
>
> Well I have a question about padding of grid elements.
>
> <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.
>
>
--
Goulven Champenois
--~--~---------~--~----~------------~-------~--~----~
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
-~----------~----~----~----~------~----~------~--~---
