[SOLVED] Align Product Image

[Clothahump]

Trying to sort out an alignment problem for a friend, product images are aligned left and frankly look quite naff, is there an easy fix to align to the centre?
http://www.aquariumplantfood.co.uk/product.php?id_product=51

[Clothahump]

Anybody help me with this???

[softbeach]

Product images looks fine to me . They are aligned in centre.

What is your issue?

[Clothahump]

Try now, owner had changed themes.

[razaro]

Try this.
Change

#primary_block #pb-right-column {
float:left;
width:310px;
}

global.css (line 1863)

to

#primary_block #pb-right-column {
float:left;
width:100%;
}

and

#primary_block #image-block {
border:1px solid #D0D1D5;
height:302px;
width:300px;
}

global.css (line 1867)
to

#primary_block #image-block {
border:1px solid #D0D1D5;
height:302px;
width:300px;
margin:0 auto;
}

[Clothahump]

Many thanks VIP but I have confused the issue, attached image showing how we would like to see the layout, a picture is worth a thousand words.

[razaro]

Sorry for really late replay I also thought you fixed it but that is other theme.

I downloaded theme and fix is to change

#primary_block #pb-right-column {
float:left;
width:311px;
}

to

#primary_block #pb-right-column {
float:left;
width:300px;
} 

[Clothahump]

We must be using different Themes, those lines are different in mine but just a change of line for the commends, changed from 310 to 300 and it looked good but.................

/* product.tpl */
#primary_block #pb-right-column {
   width: 310px;
   float: left
}
#primary_block #image-block {
   border: #d0d1d5 solid 1px;
   height: 300px;
   width: 300px
}
#primary_block #image-block img#bigpic { 
   cursor: pointer; 
   height: 300px;
   width: 300px
}
#primary_block ul#usefull_link_block {
   list-style-type: none;
   margin-top: 1em
}
#primary_block ul#usefull_link_block li { margin: 0.5em 1em 0.5em 0; display: block }
#primary_block ul#usefull_link_block li a,
#primary_block ul#usefull_link_block span.span_link,
#primary_block ul#usefull_link_block span.span_link:hover {
   text-decoration: none;
   color: #76839b;
   font-size: 0.9em;
   background: white url('../img/bullet_alt.jpg') no-repeat top left;
   padding-left: 15px;
   height: 15px
}

[razaro]

I think this theme was built for Prestashop 1.2 and crossseling module comes with 1.3.
Try adding following code to global.css

/* crosselling block */
#crossselling {
   margin: 0 auto 0;
   height: 120px;
   width: 100%
}
#crossselling_noscroll {
   margin: 0 auto 0;
   height: 120px;
   width: 100%
}
#crossselling_list {
   overflow: hidden;
   float: left;
   width: 96%
}
#crossselling_list ul {
   padding-left: 0;
   list-style-type: none
}
#crossselling_list li {
   float: left;
   margin: 0 3px;
   cursor: pointer;
   text-align: center;
   width: 100px;
   overflow: hidden
}
#crossselling_scroll_left,
#crossselling_scroll_right {
   background: url('../img/thumbs_left.gif') no-repeat center;
   text-indent: -3000px;
   display: block;
   width: 9px;
   height: 18px;
   float: left;
   margin-top: 30px
}
#crossselling_scroll_right { background-image: url('../img/thumbs_right.gif') }

[Clothahump]

That did it, many thanks, looks spot on now.

[rocky]

Please edit your first post and add [sOLVED] to the front of the title.

[stephaNNb]

Hy there.

 

I didn't get caught it...

What should i edit? to align in the middle (center).

Here`s my screen :