I’m currently having trouble with the dawn theme. I’ve personalized the website and am pretty happy with everything, but I can’t seem to get the image banner right for the desktop. it cuts off a lot of the picture and its quite blurry. Can someone help me? these are the details to my site:
URL: moimeme.com.au
password: Kbf295GhpF113
Also, I’d like to get the text on the image banner to be moved to the left on mobile view. Can anyone help with this also?
Thanks in advance!
Hi @MelissaM92
Your image dimension is suitable for mobile only. I recommend you create two Image banner sections, one for mobile and one for desktop so that you can upload images separately and add custom CSS code to each section’s custom CSS to hide mobile’s section on desktop and vice versa.
Mobile section
@media (min-width: 768px) {
.banner { display: none; }
}
Desktop section
@media (max-width: 767px) {
.banner { display: none; }
}
Hi @MelissaM92
Your image source have to zoom out to fit your banner size, from 1:1 to rectangle ratio, therefore its going to more blur.
You can use some code here to fix a little bit:
Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code
Step 2: Search file theme.liquid
Step 3: Insert this code above tag:
Hope this can help you, If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 
Could you please tell me how to insert each one separately? or the steps to put the codes in? tried to put it in the custom CSS part in theme settings but it ended up just completely removing the picture from desktop view? so not sure how to upload it separately
Each section has its own Cusom CSS
Yes i have input both the codes in that same section. but then it just removes the picture for either view depending on which code goes in first or last, but either way it just removes the picture.
Please create 2 banner sections and add a code for each, not add both codes in the same section.
thank you for bearing with me. this worked. thanks 