Download & Extend
Corolla » Issues

Float blocks in header region

Posted by giorgio79 on October 26, 2011 at 6:31pm
Project:Corolla
Version:7.x-2.x-dev
Component:Design
Category:feature request
Priority:normal
Assigned:Unassigned
Status:active

Issue Summary

Hello,

Would like to place several blocks in the header, such as FB connect, Userpoints and a like button.

I tried the top header first, second and third blocks but I found the distance from the logo was large.

The header would be ideal next to the logo.

Any tips?

Login or register to post comments

Comments

#1

Posted by giorgio79 on October 26, 2011 at 8:39pm

Just as a comment, at the moment if we add multiple blocks to header ,they are just piled under each other, because all blocks have this

.block{clear:both;margin-bottom:25px;}

I guess a default float would be better for the header area, so blocks can get next to each other. :)

PS: I Succeeded by applying clear:none, so sg like this:
#block-fb-connect-login{float:left;width:200px;clear:none;}
#block-userpoints-1 {float:right;width:200px}

#2

Posted by giorgio79 on October 26, 2011 at 8:41pm
Title:How to float blocks in header or have multiple header regions for multiple blocks?» Apply clear:none, and float:left to header blocks - so multiple blocks in header are next to each other

Changing title to be more descriptive :)

#3

Posted by Jeff Burnz on October 27, 2011 at 8:19am
Title:Apply clear:none, and float:left to header blocks - so multiple blocks in header are next to each other» Float blocks in header region

Maybe, this changes the design and there are a lot of existing users, so I'd prefer to wait for more feedback from other users before jumping into this.

#4

Posted by giorgio79 on October 27, 2011 at 8:55am

Thanks Jeff, sounds good.

Meanwhile here is a 1 liner solution

.region-header .block {clear:none;float:left;}

#5

Posted by Jeff Burnz on October 27, 2011 at 8:59am

Yeah, that's pretty much all you need to do, in some cases a particular block may need a width set on it. That said, this could break or at least disrupt the layout when viewing the site in small screens, so accounting for floated blocks at each break point is important, so check that if its important to you.

nobody click here