diff --git a/.prettierrc b/.prettierrc
new file mode 100644
index 0000000..544138b
--- /dev/null
+++ b/.prettierrc
@@ -0,0 +1,3 @@
+{
+  "singleQuote": true
+}
diff --git a/projects/ngx-picture/package.json b/projects/ngx-picture/package.json
index 48aa021..58e1762 100644
--- a/projects/ngx-picture/package.json
+++ b/projects/ngx-picture/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ngx-picture",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "repository": {
     "type": "git",
     "url": "https://github.com/jaychase/ngx-picture.git"
diff --git a/projects/ngx-picture/src/stories/1-ngx-picture.stories.ts b/projects/ngx-picture/src/stories/1-ngx-picture.stories.ts
index 474e7a0..963c4d6 100644
--- a/projects/ngx-picture/src/stories/1-ngx-picture.stories.ts
+++ b/projects/ngx-picture/src/stories/1-ngx-picture.stories.ts
@@ -95,6 +95,39 @@ storiesOf('ngx-picture', module)
       defaultViewport: 'sm'
     }
   })
+  .add('fixed height (450px)', () => {
+    return {
+      template: `<div style="height: 450px">
+      <ngx-picture [src]="src" [alt]="alt" ></ngx-picture>
+      </div>`,
+      props: {
+        src: text('src', 'assets/images/banner.jpg'),
+        alt: text('alt', 'banner image')
+      }
+    };
+  })
+  .add('fixed height (150px)', () => {
+    return {
+      template: `<div style="height: 150px">
+      <ngx-picture [src]="src" [alt]="alt" ></ngx-picture>
+      </div>`,
+      props: {
+        src: text('src', 'assets/images/banner.jpg'),
+        alt: text('alt', 'banner image')
+      }
+    };
+  })
+  .add('height auto ', () => {
+    return {
+      template: `<div style="height: auto">
+      <ngx-picture [src]="src" [alt]="alt" ></ngx-picture>
+      </div>`,
+      props: {
+        src: text('src', 'assets/images/banner.jpg'),
+        alt: text('alt', 'banner image')
+      }
+    };
+  })
   .add('eager load', () => {
     return {
       component: PictureComponent,