[WHAT WE DO] Button, customization
Rate this topic: 1.00 out of 6 based on 1 vote(s)
- GK User
- Mon Oct 13, 2014 11:54 am
- Reply with quote
- Report this post
Hi,
I made a customization of the button with different border and background color; you can see it here:
http://www.poderebellavista.net
the problem is for intro n. 1, the button position of the first slide is moved some pixel to the right (about 90 px).
When the slide start flipping this problem disappear and button is correctly centered.
I can't find this problem
this is customizations for that button, I made it in override template section:
a.gkLearnMore.loaded {
font-family: 'Tangerine', Arial, sans-serif;
font-size:48px;
font-weight:bold;
color:#bf922d;
text-shadow: 1px 1px 5px #fff;
background-color: rgba(255,255,255,0.7);
padding: 14px 25px 6px 20px;
}
.gkIsWrapper-gk_creativity .figcaption > a {
border: 0;
border-radius: 40px;
}
I made a customization of the button with different border and background color; you can see it here:
http://www.poderebellavista.net
the problem is for intro n. 1, the button position of the first slide is moved some pixel to the right (about 90 px).
When the slide start flipping this problem disappear and button is correctly centered.
I can't find this problem
this is customizations for that button, I made it in override template section:
a.gkLearnMore.loaded {
font-family: 'Tangerine', Arial, sans-serif;
font-size:48px;
font-weight:bold;
color:#bf922d;
text-shadow: 1px 1px 5px #fff;
background-color: rgba(255,255,255,0.7);
padding: 14px 25px 6px 20px;
}
.gkIsWrapper-gk_creativity .figcaption > a {
border: 0;
border-radius: 40px;
}
-
- Fresh Boarder
- GK User
- Mon Oct 13, 2014 1:23 pm
- Reply with quote
- Report this post
This proble occours probably because position of element is counted when custom font is not loaded. After loading the custom font element becomes bigger and looks wrong.
You can add to your override.css declaration this code:
You can add to your override.css declaration this code:
- Code: Select all
a.gkLearnMore.loaded {
font-family: 'Tangerine', Arial, sans-serif;
font-size:48px;
font-weight:bold;
color:#bf922d;
text-shadow: 1px 1px 5px #fff;
background-color: rgba(255,255,255,0.7);
padding: 14px 25px 6px 20px;
margin-left: -163px !important;
}
-
- Moderator
- GK User
- Mon Oct 13, 2014 1:23 pm
- Reply with quote
- Report this post
It will not work fine if you change element size (its text for example).
-
- Moderator
- GK User
- Mon Oct 13, 2014 1:43 pm
- Reply with quote
- Report this post
many thanks. it works !
-
- Fresh Boarder
- GK User
- Mon Oct 13, 2014 5:53 pm
- Reply with quote
- Report this post
If you will have any other questions, feel free to post new forum threads.
-
- Moderator
5 posts
• Page 1 of 1