Going full width with MusicState?

Good day -

I love the Music State template but would like to be able to make the header image go full width on my iMac with 27" screen (i.e. to extremities of the window), like on other Gavick templates, like Event Manager, University or John.

How easy is it to go full width on the header GK slideshow and even across the whole template (i.e. remove the black margin bars which are visible on my iMac) and how would I implement?

Thx

If you would like to increase the width only on gkImageShow module - sadly - it is possible, but requires a lot of changes in the code which are beyond our technical support.
If you would like to make whole page 100% width, please edit: /templates/gk_musicstate/css/override.css and add at its end:

Code: Select all

#gkBg {
max-width: 100%
}


Remember to enable "CSS override" in template settings - advanced section.

Hi Cyberek, thanks for the rapid response.

No problem on gkImageShow - I can go with the whole page.

That code has worked perfectly except is there a way I can fix the diagonal strips in the override.css code too?

They haven't gone full width too so look a bit awkard. Please see attached image.

Thnx

Could you please post an url to your site?

How u fixed the problem with the stripes?
have the same problem
my site url is
www.gakopoulos.com

Well any way to fix it?

1. Please do not bump your questions.
2. Well, it was not designed to work this way. You could fight with this element height via override.css:

Code: Select all

.frontpage #gkDarkBottom:after, .frontpage #gkDarkBottom:before {
    height: 360px;
}


by increasing the height value, but I guess it will not help much.

no result with this css override. i think it an easy way to fix that but i cant find the rightr part to edit.
Since you developed this template you should give me the right path to fix it myself.

ps. Sorry for the double question forgot it was weekend

Sorry, but my crystal ball doesn't work well... How would you like to fix it - what should be the outcome?
Ps, I'm not a developer of the template, I'm a moderator with frontend/backend skills

I mean what causes the issue. Tried to firebug it but couldn't find why the white lines don't go exactly like they were in full width. They should be in my opinion. What I should try to modify to fix the problem

If I could change the orientation degree of the white lines I think that would help because it would remove the black triangles between the white lines and the sections of the template.
You think this is possible?
Thanks in advance

You can modify skew this way:

Code: Select all

.frontpage #gkDarkBottom:after, .frontpage #gkDarkBottom:before {
    height: 350px;
    top: -175px;
    -webkit-transform: skewY(12deg);
    -moz-transform: skewY(12deg);
    -ms-transform: skewY(12deg);
    -o-transform: skewY(12deg);
    transform: skewY(12deg);
}


You can also try modifying other values (position, height)

Let me try to show you the problem. the arrows show aht is the problem in full widht. this black triangles i want to remove. I put the ovveride cdd you sent but could not solve the problem. inform me if you need ftp access.

Provided code will not fix the issue, please work with skew number (all values) to try to compensate.