-
AuthorPosts
-
August 23, 2013 at 11:56 am #28316
Hi,
this is different problem, so I choose to open a new thread for this.
I added the button into the header, like in this thread.
https://kriesi.at/support/topic/full-screen-slider-image-chopped
But there’s two problems.
one problem with the small fixed header:
the button isn’t centered, see here:
http://awesomescreenshot.com/04e1n1if89
I’ve tried with the header with social icons. There it works, but I don’t want the social icons in my header.
the second problem is now, that the button in the footer isn’t centered anymore.
See here: http://awesomescreenshot.com/0ca1n1inc9
I’ve tried to mess around with the values, but nothing worked. Right now, the custom css looks like this:
.main_menu {
right: 100px;
}
.avia-button-right {
display: inline-block;
left: 0px;
position: relative;
float: right;
}
@media only screen and (max-width: 767px) {
.avia-button-right {
left: initial;
position: absolute;
top: 0px;
right: 0px;
}
}
Can you help me out?
Cheers
August 24, 2013 at 2:46 pm #137209Hi DoGrinDigital,
We need to see the actual site live. The 2 screenshot urls both go to 502 errors as well.
Regards,
Devin
August 24, 2013 at 4:52 pm #137210August 25, 2013 at 7:27 am #1372111) To center the button in the header change the margin-top value from 39px to 25px. You can also use another value if you feel that 25px doesn’t look right.
2) To center the button in the footer try following css code – insert it into the quick css field
#footer .av_promobox .avia-button.avia-size-large {
margin-top: -100px;
}August 25, 2013 at 9:43 am #1372121) Nothing changes. When I reload the page, the button seems to be in the right position for a second, but then jumps back down.
2) The position is now right, thanks. But the button is kind of narrow. The width is way smaller than the normal button, that was there before. (Before I added the button to the header)
August 25, 2013 at 11:11 pm #137213The value is still set to 39px in your header.php file where you added the code for that button.
The footer button can have its size specifically set with:
#footer .av_promobox .avia-button-wrap.avia-button-right {
width: 215px;
}Regards,
Devin
August 26, 2013 at 9:31 am #137214I know it appears so, but I changed the value to 25. It’s really changed, as you can see here:
http://awesomescreenshot.com/01d1na2z18
That shortcode fixed the footer-problem. Thanks!
August 26, 2013 at 11:18 pm #137215The only thing I can think of is that there is something preventing the page from showing on the front end. Either a caching plugin or server side caching.
You can try adding a fake class on the button and see if it gets reflected on your sites source code but also you can force the change with a bit of css:
#header .avia-button-wrap.avia-button-right {
margin-top: 25px !important;
}This is just a bandaid though.
Regards,
Devin
August 27, 2013 at 7:31 am #137216This shortcode made it. I’ll try to find out, which plugin is preventing the change on the front end.
Thank you!
-
AuthorPosts
- The topic ‘Button in header and footer problem’ is closed to new replies.