change image box product page

[Gastono]

hi all,

i'm trying to change the image box on the product page for medium devices.

After puzzling for hours i managed to reduce the picture box size.

see link

http://shopnw.naturalbeautyparkstad.nl/oog-en-lip-verzorging/advanced-intensive-eye-care.html

 I changed the image box from 42% of container to 25% of container by changing the following in global.css col-md-5 at line 858

 

@media (min-width: 992px) {

  .container {

    max-width: 970px; }

 

  .col-md-1,

  .col-md-2,

  .col-md-3,

  .col-md-4,

  .col-md-5,

  .col-md-6,

  .col-md-7,

  .col-md-8,

  .col-md-9,

  .col-md-10,

  .col-md-11 {

    float: left; }

 

  .col-md-1 {

    width: 8.33333%; }

 

  .col-md-2 {

    width: 16.66667%; }

 

  .col-md-3 {

    width: 25%; }

 

  .col-md-4 {

    width: 33.33333%; }

 

  .col-md-5 {

    width: 25.66667%; }

 

this was the only way i figured out how to do this.

is this the right way to do this or will this give problems on other pages of the shop???

 

[vekia]

dont change bootstrap files and css values,

it's bad idea to change these files. it will affect also other part of shop!

 

it's better to alter product.css file

and add width param to

.pb-left-column #image-block {
position: relative;
display: block;
/* cursor: pointer; */
padding: 5px;
border: 1px solid #dbdbdb;
background: white;
}

[Gastono]

OK.

Thought this was a bad idea.

Gotta go work now. Will give it a try tonight.

[Gastono]

changed it back to orginal parameters.

added :

@media (min-width: 992px) {
	 .pb-left-column #image-block {
	 width: 280px;[spam-filter]

and looks al right now.

 

Thanks so much milos

 

greetings   Gaston

see you in my next question

Edited December 1, 2014 by Gastono (see edit history)