Rearrange Product Page

You can modify the look of the product page by editing the file "show" of the view "product" via the menu Display>Views.

Padding can be added by adding some CSS in the front end CSS file that you can edit via the Display tab of the configuration.
More specifically:
#hikashop_product_description_main { padding: 50px; }

That cannot be done via CSS.You need to edit the file "show" of the view "product" via the menu Display>Views and move the image block of code before the price block of code.

The image block of code is (for 1.5.4):
<div id="hikashop_product_image_main" >
<div id="hikashop_main_image_div" class="hikashop_main_image_div">
<?php
$image = null;
if(!empty($this->element->images)){
$image = reset($this->element->images);
}
if(!$this->config->get('thumbnail')){
if(!empty($image)){
echo '<img src="'.$this->image->uploadFolder_url.$image->file_path.'" alt="'.$image->file_name.'" id="hikashop_main_image" style="margin-top:10px;margin-bottom:10px;display:inline-block;vertical-align:middle" />';
}
}else{

$height = $this->config->get('thumbnail_y');
$style='';
if(!empty($this->element->images) && count($this->element->images)>1){
if(!empty($height)){
$style=' style="height:'.($height+5).'px;"';
}
} ?>
<div class="hikashop_product_main_image_thumb" id="hikashop_main_image_thumb_div" <?php echo $style;?> >
<?php echo $this->image->display(@$image->file_path,true,@$image->file_name,'id="hikashop_main_image" style="margin-top:10px;margin-bottom:10px;display:inline-block;vertical-align:middle"','id="hikashop_main_image_link"'); ?>
</div>
<?php }
?>
</div><div id="hikashop_small_image_div" class="hikashop_small_image_div"><?php
if(!empty($this->element->images) && count($this->element->images)>1){
foreach($this->element->images as $image){
echo $this->image->display($image->file_path,'hikashop_main_image',$image->file_name,'class="hikashop_child_image"');
}
}
?>
</div>
</div>



The price block of code is:
<span id="hikashop_product_price_main" class="hikashop_product_price_main">
<?php
if($this->params->get('show_price')){
$this->row =& $this->element;
$this->setLayout('listing_price');
echo $this->loadTemplate();
}
?>
</span>

You can edit the front end CSS file of HikaShop via the interface in the Display tab of the configuration and change the code:
.hikashop_product_right_part {
float: left;
padding-left: 1px;
}

to:
.hikashop_product_right_part {
width: 150px;
margin: auto;
}

You didn't remove the CSS I said to remove:
.hikashop_product_right_part {
float: left;
padding-left: 1px;
}

No problem about that. If you update the views via the menu Display->Views, you won't loose your changes when you update HikaShop.

I can still see:
.hikashop_product_right_part{
float:left;
padding-left:1px;
}

in your CSS file: bledsoe.cloudaccess.net/media/com_hikash.../frontend_custom.css

Here:


hikashop_product_main_image_thumb{
margin-bottom:5px;
}

.hikashop_product_right_part{
float:left;
padding-left:1px;
}
.hikashop_product_bottom_part{
clear:both;
width:100%;
}
.hikashop_product_characteristic_chooser{
text-align:center;
}