arnaudleray/pocketgrid

Vertically align floating blocks

dlzi opened this issue · 2 comments

dlzi commented

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?

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

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.