search

arnaudleray / pocketgrid

PocketGrid is a lightweight pure CSS grid system for Responsive Web Design. Moreover, it is semantic, mobile-first, and allows to have an unlimited number of columns and breakpoints.
http://arnaudleray.github.io/pocketgrid/
MIT License
321 stars 48 forks source link

Vertically align floating blocks #3

Closed dlzi closed 11 years ago

dlzi commented 11 years ago

Hello,

I'm struggling to align vertically two nested blocks. Something like this:

<div class="container block-group">
    <div class="block title float-left">
        <h1>Floating left</h1>
    </div>

   <div class="block breadcrumb float-right">
         home/test/pocketgrid (it's an inline list)
   </div>
</div>

Any tips?

arnaudleray commented 11 years ago

Hi!

Sorry for the delay, I am on vacation! ;) I'm not sure to understand what you're trying to do. Are you trying to vertically center the "Floating left" text and the "home/test/pocketgrid" text? Or are you trying to vertically center the entire blocks?

Could you provide a more complete source for testing?

I can suggest you to read this article about vertical centering: http://blog.themeforest.net/tutorials/vertical-centering-with-css/

dlzi commented 11 years ago

Hey.

Sorry, if I couldn't explain better. But you are right, I'm trying to vertically center the "Floating left" text and the "home/test/pocketgrid" text. The only example I have is in a project that I'm working on, but it's not open for public yet. If you don't mind, I can send you the link by email.

Thanks.