Responsive indhold

[peternicolaj]

Hej jeg sidder og arbejder på en responsive template.

Dog er billeder i produktbeskrivelse og kategorier ikke responsive.

Jeg har prøvet at indsætte dette i min style.css

 .product-image {
    float: left
    width: 100%;
 }

Og dette i produktbeskrivelsen:

<img src="image1.jpg" class="product-image">

Jeg sætter ingen størrelse på billederne.

Men det slår ikke igennem? Er der nogen der har et godt bud?

[KentChr_DK]

Hej @peternicolaj,

Har du forsøgt med at tilføje enten "max-width:100%;" eller "float:left" ?

.some-class-that-selects-image img {
    width: 100%;
    max-width: 100%;
    float:left; /*alternativ*/
}  

 /Kent

[peternicolaj]

Prøver dette. Måske denne opsætning ved billedet er forkert?

<img class="some-class-that-selects-image img" src="{{media url="wysiwyg//tindaaser/tindaaser_1.jpg"}}" />

[KentChr_DK]

Hej @peternicolaj,

Du skal jo have samme class i din css ?

Har du ændret til den jeg skrev i din styles.css fil, ellers kan du prøve at tilføje det jeg skrev i din css, også give billedet samme class som i din css

Husk at tømme cachen og browseren før test.. Og tjek også hvis du har komprimeret css / js i magento admin, så kan dette også påvirke det resultat du ser.

Hvilket theme kører du med / url til dit site ?

[peternicolaj]

Jeg sætter denne ind i style.css

.some-class-that-selects-image img {
    width: 100%;
    max-width: 100%;
    float:left; /*alternativ*/
}

Jeg sætter billedet ind i min produktbeskrivelse og tilføjer  class.

<img class="some-class-that-selects-image img" alt="" src="{{media url="wysiwyg//xxx/xxx.jpg"}}" /></p>      

Tømmer min cashe. Men der sker stadig ikke noget.

Det er min style.css det skal i og ikke responsive.css?

Jeg bruger templaten accessshop https://www.magentocommerce.com/magento-connect/accessshop-lite-theme.html

[KentChr_DK]

Er det style fra dit theme du bruger style.css?

[peternicolaj]

Ja? er det gennem base, jeg skal sætte det?

[KentChr_DK]

Nej. I dit eget theme.
Hvad har du under system > konfiguration > generelt > design.
Har du da indsat noget under de 3 felter.
Eller måske dit theme tillader Custom CSS, står der noget i manualen til dit theme?

[peternicolaj]

Næ, synes jeg har sat det op på alle tænkelige måder både i min style.css og mainresponsive.css.

Der står desværre ikke noget om custom css, og synes i det hele taget det meget lidt info der er at finde om det.

Dog er en af mine blocks responsive. I mainresponsive.css ligger der denne, men jeg har ikke kunne få den omskrevet til at virke i produktbeskrivelse:

  .block-content > img {
    width: 100%;
  }

I design har jeg Accessshop i første felt og default i nederste, som vist i dokumentationen.

[peternicolaj]

Jeg kan sætte den i min main.css, hvor img-responsive allerede står og problemet er løst på mobil. Til gengæld udvider den billedet på pc, så det bliver større end det er. Hvordan kan jeg ændre det?

    .img-responsive{
      margin: auto;
     width: 100%;
     max-width: auto;
     float:left; /*alternativ*/
}