Quark header image sizing

12/3 quark e commerce quick install
www.ahgoobaby.com/Redesign3

I have used a prior post code to increase the size of the header image.

I'm only able to get the size of the 1040 px to impact the size of the baby image for desktop mode:
@media (max-height: 1040px) {
#gkHeaderMod .gkStoreImage > img {
height: auto !important;
width: 200% !important;
}

I tried using all of the other max-height pixel combinations recommended in that post, but they have no impact on the size of the image when in tablet mode or mobile landscape mode. In each I have tried everything from 25% to 200% and the image remains the same size.

How do I know what max-height px afftects those screens?

Hi

I know we are doing it over and over again, but I still have no idea how do You want this to looks like, but the way You are using Your code will not make a difference since image cannot resize over the space available for it. Try play with sizes of a boxes text and image are in:

Code: Select all

.gkStoreHeader {
    width: 30%;
}

.gkStoreImage {
    width: 70%;
}


It took help from another boarder outside of Gavick to help me fix the problem. Here is the solution:

The following to small.tablet.css:

.gkStoreImage {
display: block !important;
vertical-align: middle !important;
width: 80% !important;
margin-left: auto !important;
margin-right: auto !important;
}

.gkStoreHeader {
display: block !important;
position: relative !important;
vertical-align: middle !important;
margin-left: auto !important;
margin-right: auto !important;
}

and changed line 206 to:

width: 100% !important;

See the results in mobile phone portrait, tablet portrait modes. Would be great if maybe someone from Gavick could help with one of the numerous other posts that remain unanswered.

Hi

Is this correct ? I can see this code only is used for smaller tablets. I'm really happy it's done. I think I still do not understand what Your request was here about. Closing this thread than.