Tengo una pregunta rara. En mi página tengo una imagen principal de un planeta en una nebulosa de trabajo pesado. Lo tengo configurado para que el ancho mínimo sea 1000px y el máximo sea 1500px. Tengo los lados desvanecidos y esto se ve muy bien con pantallas más grandes. Lo que me gustaría intentar hacer es cuando lo miras en un dispositivo móvil, por ejemplo, y está cortando el ancho a 1000 píxeles. Me gustaría que la imagen diga 1300 píxeles de ancho, centrado y 150 píxeles cortados. fuera de cada lado para que no pueda ver el fundido, pero aún así se puede agrandar si el ancho de la ventana se hace más grande como un iMac grande y ese fundido vuelve a ser visible una vez que pase ese ancho de 1300 píxeles.

Mi idea inicial fue hacer algo con márgenes negativos en ambos lados, pero no pude hacer que esto funcionara a la vez que mantenía los anchos máximos y de mezcla.

Esta es la sección específica del código de la página, aunque html y css están ahí para que todos lo puedan ver, simplemente puede usar el comando fino para encontrar esa ID de div para cualquier observación adicional.

<code><div style="position:relative;width:100%;">
   <div id="help" style="
      position:relative;
      z-index:1;
      height:100%;
      min-width: 1000px;
      max-width: 1500px;
      margin: 0 auto;
   ">
      <img src="http://i.stack.imgur.com/tFshX.jpg" border="0" style="width:100%;">
   </div>
</div>
</code>

Cualquier pensamiento sobre esto, está muy cerca de funcionar como me gustaría, solo necesita un pequeño ajuste.