Tagged: button, responsive, Slide Show, travel
-
AuthorPosts
-
November 27, 2016 at 6:18 pm #717452
Hey guys,
I am currently building a website based on your Travel Demo, but am having issues with the Headline, Subheadline and the two buttons that are overlaying the Slide-Show (Full-Width) at the top of the front page. It looks fine on Desktop landscape, but the rearrangement doesn’t work properly when it is viewed on portrait. Is it possible to fix this somehow?
Thanks,
eCNovember 29, 2016 at 5:03 pm #718352Hey eC,
use this code inside Quick CSS field:
@media only screen and (max-width: 767px) { .html_header_transparency #top .avia-builder-el-0 .container, .html_header_transparency #top .avia-builder-el-0 .slideshow_caption { padding-top: 15px; } #full_slider_1 { height: 220px; } .avia-slideshow.avia-slideshow-1.av-control-hidden.avia-slideshow-featured_large.av_slideshow_full.avia-fade-slider { height: 237px; }}
Hope this helps!
Best regards,
AndyNovember 29, 2016 at 6:20 pm #718427Hey Andy,
thanks for your answer. This seemed to help, but in between there are still some resolutions, where the buttons disappear and also some of the text. Is there any way to further improve this, or is this already the best compromise to make it work as best as possible on all devices and for the normal browse-behaviour of the average user?
Thanks,
eCNovember 30, 2016 at 1:35 pm #718736Hi,
you need to adjust media queries and for more information about it check out: https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
Best regards,
AndyDecember 10, 2016 at 3:18 pm #722689Hi Andy,
I see – but so far it looked alright on mostly all devices I tried it on, thanks again. One last question regarding this, is it possible to have the buttons centered vertically for mobile portrait?
Best,
eCDecember 12, 2016 at 3:32 pm #723181Hi,
sicher, nutze diesen code im Quick CSS Feld dafür:
@media only screen and (min-width: 414px) and (max-width: 736px) and (orientation: portrait) { a.avia-slideshow-button.avia-button.avia-color-theme-color.avia-multi-slideshow-button { margin-right: 0px; }}
Gruß,
AndyDecember 12, 2016 at 3:46 pm #723197Hi, Andy!
Danke, aber das scheint leider nicht funktioniert zu haben. Anhängig einmal die kompletten Quick-CSS und Child-Theme functions.php Modifikationen – vielleicht steht dazu ja etwas in Konflikt?
Danke und Gruß
eC- This reply was modified 7 years, 11 months ago by eC.
December 13, 2016 at 3:38 pm #723756Hi,
wenn du wissen willst, ob irgendein Code im Konflikt steht, dann nimm jeden Code einzeln raus und schau welcher die Ursach sein könnte. Aber ich bezweifle das dies in deinem Fall so sein könnte.
Bitte füge ein !important zu meinem Code hinzu:
@media only screen and (min-width: 414px) and (max-width: 736px) and (orientation: portrait) { a.avia-slideshow-button.avia-button.avia-color-theme-color.avia-multi-slideshow-button { margin-right: 0px !important; }}
Gehe sicher, dass du oder dein Server kein Caching verwendet.
Gruß,
AndyDecember 14, 2016 at 6:30 pm #724430Hi Andy,
danke – aber scheint leider immer noch nicht zu funktionieren. Alle Caches geleert etc. – andere Änderungen sehe ich auch, also sollte es daran nicht liegen.
Danke und Gruß
eCDecember 14, 2016 at 8:58 pm #724543Hi,
Login funktioniert nicht. Bitte einmal checken.
Gruß,
AndyDecember 16, 2016 at 4:52 pm #725439Hi Andy,
sie unten.
Danke und Gruß,
eCDecember 19, 2016 at 1:52 pm #726001Hi,
du verwendest und/oder hast ein ein Caching Plugin verwendet, daher gehe in deren Einstellungen und schalte dort das Caching aus. Anschließend deaktiviere das Caching Plugin und alle anderen Plugins, um zu schauen, ob eins dieses Problem verursacht. Hinterher leere deinen Browser Cache und hard refresh einige Male.
Gruß,
Andy -
AuthorPosts
- You must be logged in to reply to this topic.