Centering Public Photos on Homepage

Ok, I know this is simple because I did't even document it when I upgraded to 7.1.b2 but I can not find it in the forum here. I want to center the pictures "public photos", "videos" and "sounds" on my Homepage and I am not sure where to go. Please help, I have spent way to much time already looking for it. Thank you in advance for your time.  

Michael
Quote · 15 Jul 2013

Not sure if I understand exactly what you want to do but you could create a three column page layout with the centre column the width you wish for the "public photos", "videos" and "sounds".  This will place those blocks centred on the page.  You can install the free module "full width columns" if you wish a different layout above and below the modules mentioned.  There is also a module in the market that allows you float blocks left and right that would allow several blocks to be floated in the full width column.

Geeks, making the world a better place
Quote · 15 Jul 2013

Thanks Geek, but I am not looking to add more custom stuff then I need to. I do have 3 columns for the layout but everything is left justified. I am not looking to play with the width of the center column, because I look at that as a patch that may cause problems later. It was very simple, something like adding a line position: center somewhere. I just am not sure where anymore. Thanks again for you time on this.     

Michael
Quote · 15 Jul 2013

There is no position:center.

The blocks will fill the width of the column they are in.  what you can do is to look at the css for the block's design box it is using and see if the issue is there.  Each design box will have css applied to it.  The default design box is design box 1.  You would look at the width in the CSS, the margins.  If width is set to 100%, it will fill the width of the container it is placed in.  However, you also have settings for margins; if you have margin-left set to 10 px and margin-right set to 20 px then the block will not be centred in the container.

What you can do is to turn off CSS caching and use Firebug or similar to look at the css and even play around with it in real time without affecting the site.  You can see the results of the changes you make in real time without it breaking the site for your members.

Geeks, making the world a better place
Quote · 15 Jul 2013
.bx-def-bc-margin-thd 
    marginauto;
    width: 80%;

In default.css 

Thanks
Michael
Quote · 15 Jul 2013

A better way to handle this:

div.page_block_container {
    margin-leftauto;
    margin-rightauto;
    width100%;

div.page_block_container {
    margin-leftauto;
    margin-rightauto;
    width100%;

This takes care of all the pages no matter how many columns you have in the container.  

 
Michael
Quote · 17 Jul 2013

Sorry, I meant to add this line:

.bx-def-bc-padding-thd {
    margin-leftauto;
    margin-rightauto;
    width85%;

This will take care of the pages like "Top Photo" or "Popular Sounds". You may need to play with the width on this one to work with your template. 
 

 
Michael
Quote · 17 Jul 2013
 
 
Below is the legacy version of the Boonex site, maintained for Dolphin.Pro 7.x support.
The new Dolphin solution is powered by UNA Community Management System.