Stirling Grand Responsive Template

Quote:

---

Originally Posted by picaflor-azul

This is a bug in the old version of the responsive template default code. It will be fixed in the template package when I update to the newest version of the responsive template default code. There was discussion of this just a day or two ago on another of my responsive template threads. If you do a forum search you will find it.

---

Thanks for your speedy reply. I found that the img tag in responsive.css was causing the problem. I've commented it out for now, but haven't yet checked how it affects smaller screens.

Line 4:
img{max-width:100%;height:auto;border:0;}

Quote:

---

Originally Posted by paul3648

Thanks for your speedy reply. I found that the img tag in responsive.css was causing the problem. I've commented it out for now, but haven't yet checked how it affects smaller screens.

Line 4:
img{max-width:100%;height:auto;border:0;}

---

This line of css can not be removed because it is important for the responsiveness of the design. It resizes the width of images so that they shrink to fit the size of the device that is used to view the site.

I do not have the time to look up a solution that another member posted just a few days ago. If you do a quick forum search you will find the post. It was on one of the other threads for my responsive templates.

Thanks,

Anne

Quote:

---

Originally Posted by picaflor-azul

This line of css can not be removed because it is important for the responsiveness of the design. It resizes the width of images so that they shrink to fit the size of the device that is used to view the site.

---

Yes, I noticed that. I found the threads with posted solutions, but they don't quite work for my situation. No worries, my site is still in development, I'll post my solution when I find it.

Quote:

---

Originally Posted by paul3648

Yes, I noticed that. I found the threads with posted solutions, but they don't quite work for my situation. No worries, my site is still in development, I'll post my solution when I find it.

---

That would be great ;)

Thanks,

Anne

I am loving this template! Just having one small problem that I can't seem to solve. Have searched extensively and tried several things, but to no avail!

All I want to do is change the header area where the logo and tag line are in the upper left corner. I want to make the logo bigger and remove the text below it completely! Anyone know if this is possible?

I would like for my image to be as large as possible without pushing everything out of shape. Right now if I go any larger than 60px high, everything looks funky!

Sorry if this is simple and I just don't get it. Thanks in advance for any help!

EDIT: My website is https://hufflepuffvapes.com

Quote:

---

Originally Posted by SBNHPV

I am loving this template! Just having one small problem that I can't seem to solve. Have searched extensively and tried several things, but to no avail!

All I want to do is change the header area where the logo and tag line are in the upper left corner. I want to make the logo bigger and remove the text below it completely! Anyone know if this is possible?

I would like for my image to be as large as possible without pushing everything out of shape. Right now if I go any larger than 60px high, everything looks funky!

Sorry if this is simple and I just don't get it. Thanks in advance for any help!

EDIT: My website is https://hufflepuffvapes.com

---

Any modifications are possible, but you will probably have to make adjustments to the css, xhtml, or php files.

Thanks,

Anne

Quote:

---

Originally Posted by picaflor-azul

Any modifications are possible, but you will probably have to make adjustments to the css, xhtml, or php files.

Thanks,

Anne

---

Okay, I am fine with that. What needs to be changed?

Here's my solution for the "larger image" problem:

responsive.css line 4 change

Code:

---

img{max-width:100%;height:auto;border:0;}

---

to

Code:

---

img{height:auto;border:0;}

---

Add

Code:

---

img{max-width:100%;}

---

to the bottom of the

Code:

---

@media (min-width:768px) and (max-width:979px){

---

section (around line 263).

Clicking on the "larger image" link - I've been trying out my design on a tablet, and when you click on the "larger image" link, a new window opens. This is fine on a desktop computer, because it's obvious that a new window has opened, but on the tablet the image takes up the whole screen, with nothing to indicate what to do next.

I think we need some kind of text identifying the image and something like "click image to continue".

Quote:

---

Originally Posted by paul3648

Clicking on the "larger image" link - I've been trying out my design on a tablet, and when you click on the "larger image" link, a new window opens. This is fine on a desktop computer, because it's obvious that a new window has opened, but on the tablet the image takes up the whole screen, with nothing to indicate what to do next.

I think we need some kind of text identifying the image and something like "click image to continue".

---

I would recommend trying the zen magnific module or zen lightbox module.

Thanks,

Anne