# Horizontal Flyout
**URL:** https://forum.pinegrow.com/t/horizontal-flyout/2904
**Category:** General
**Created:** [April 2, 2019, 2:23am UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904 "2019-04-02T02:23:47Z")
**Posts on this page:** 20
**Page:** 1
### Author:  [@randyrie](https://forum.pinegrow.com/u/randyrie)
#### Post date: [April 2, 2019, 2:23am UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/1 "2019-04-02T02:23:47Z")
Is there a way, within the PineGrow app, to create a horizontal flyout?
Anyone have any suggestions or ideas?
---
### Author:  [@Printninja](https://forum.pinegrow.com/u/Printninja)
#### Post date: [April 2, 2019, 4:21am UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/2 "2019-04-02T04:21:21Z")
My suggestion would be don’t use it. It’s a confusing UI element that doesn’t fit with the design of your site. As your site is tailored towards a certain demographic, I would make a straightforward link in the navigation that took them to a testimonial page.
---
### Author:  [@randyrie](https://forum.pinegrow.com/u/randyrie)
#### Post date: [April 2, 2019, 3:11pm UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/3 "2019-04-02T15:11:27Z")
Thanks for your response, @Printninja. I’ll take your advise and leave it as is, with the modal collecting the info.
But do you have a lead to where I could learn how to do a flyout as I’ve described? I may have another client who would like one of these on their site that would contain custom content, not a testimonial.
---
### Author:  [@Printninja](https://forum.pinegrow.com/u/Printninja)
#### Post date: [April 3, 2019, 12:25am UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/4 "2019-04-03T00:25:34Z")
Something like this…
[www.thelightwavegroup.com](http://www.thelightwavegroup.com)
---
### Author:  [@randyrie](https://forum.pinegrow.com/u/randyrie)
#### Post date: [April 3, 2019, 3:05pm UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/5 "2019-04-03T15:05:17Z")
EXACTLY! OK to ‘steal’ your code from the page?
---
### Author:  [@Printninja](https://forum.pinegrow.com/u/Printninja)
#### Post date: [April 3, 2019, 6:23pm UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/6 "2019-04-03T18:23:06Z")
Of course. That’s why I put it up 😉
---
### Author:  [@randyrie](https://forum.pinegrow.com/u/randyrie)
#### Post date: [April 3, 2019, 10:42pm UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/7 "2019-04-03T22:42:51Z")
Thanks, I appreciate your help. Is this code hand written by you or is it taken from a widget that lies somewhere within PineGrow?
---
### Author:  [@Printninja](https://forum.pinegrow.com/u/Printninja)
#### Post date: [April 3, 2019, 11:21pm UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/8 "2019-04-03T23:21:19Z")
No, not from Pinegrow. It was something I found online some time ago that I modified to look like your example.
---
### Author:  [@randyrie](https://forum.pinegrow.com/u/randyrie)
#### Post date: [April 13, 2019, 2:16pm UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/9 "2019-04-13T14:16:55Z")
@Printninja
‘Stole’ your flyout code and implemented it on my personnel site: [https://www.statecollegedev.com/rjrwebz](https://www.statecollegedev.com/rjrwebz)
I think it works slick! Thanks again for your help with this.
---
### Author:  [@Printninja](https://forum.pinegrow.com/u/Printninja)
#### Post date: [April 13, 2019, 7:01pm UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/10 "2019-04-13T19:01:36Z")
Well done! I like the little added touches (border, text shadow.)
---
### Author:  [@Thomas](https://forum.pinegrow.com/u/Thomas)
#### Post date: [April 13, 2019, 8:44pm UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/11 "2019-04-13T20:44:31Z")
This page example breaks at 1900px and above!
Cheers
Thomas
---
### Author:  [@randyrie](https://forum.pinegrow.com/u/randyrie)
#### Post date: [April 14, 2019, 12:23am UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/12 "2019-04-14T00:23:53Z")
@Thomas
I don’t have a 1900px monitor… what ‘breaks’ at that rez?
---
### Author:  [@Printninja](https://forum.pinegrow.com/u/Printninja)
#### Post date: [April 14, 2019, 3:12am UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/13 "2019-04-14T03:12:05Z")
> [@Thomas](#):
>
> This page example breaks at 1900px and above!
Confirmed. The first line in your style.css stylesheet is
`@media only screen and (max-width: 1900px)`
So everything above 1900px is unstyled by the rules that follow, which is causing all sorts of display problems.
Why are you using a max-width on the site?
Also, just a few other observations…
There are text alignment issues with the text “RjRWebz” and “Your Site Your Way.” They do not remain centered when the screen width changes.
The images in your portfolio slideshow are blurry, particularly at larger screen sizes.
You might want to consider not using an image for the “About Me and My Rates” because the text becomes too small to be readable at smaller screen sizes (also, just a friendly suggestions from one designer to another - you need to at least triple your hourly rate 😉) Also, what’s with the scary shadow dude holding a gun?!?
---
### Author:  [@randyrie](https://forum.pinegrow.com/u/randyrie)
#### Post date: [April 14, 2019, 7:22pm UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/14 "2019-04-14T19:22:47Z")
Thanks for your input and good points @Printninja … I originally did this site as a test project but I am now being encouraged to promote this to a serious self-promotion site - - so I’ll rework the site accordingly. I am in the process of doing higher-res screen captures of my various homepages for the carousel.
BTW, the “scary dude” was to be replaced as soon as my daughter photographer could take my portrait as its replacement (it was an inside joke) but I’ll end the joke and simply place my rates as text as you suggest. FYI, my rates meet my local market expectancy.
---
### Author:  [@randyrie](https://forum.pinegrow.com/u/randyrie)
#### Post date: [April 14, 2019, 10:27pm UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/15 "2019-04-14T22:27:43Z")
@Printninja
Made some progress following your suggestions and have published my site to: [https://www.statecollegedev.com/rjrwebz](https://www.statecollegedev.com/rjrwebz)
How’s it looking?
---
### Author:  [@Printninja](https://forum.pinegrow.com/u/Printninja)
#### Post date: [April 15, 2019, 10:09pm UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/16 "2019-04-15T22:09:17Z")
Great! I really don’t see any other problems now.
---
### Author:  [@randyrie](https://forum.pinegrow.com/u/randyrie)
#### Post date: [April 16, 2019, 2:18am UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/17 "2019-04-16T02:18:15Z")
Personal Note:
I’m feeling a lot more confident about creating websites as an independent now that I’m retired and no longer have my staff around to perform the minutiae of building them (fonting, design & layout, coding, etc). Now that I’m wearing all the hats, I feel more confident that I can do this because of forum members as yourself willing to jump in with advice and steer me away from pitfalls. I’ve learned so much but mostly learned that I know so little. So as a retiree, I’m launching an effort to build a part-time business creating websites.
---
### Author:  [@Printninja](https://forum.pinegrow.com/u/Printninja)
#### Post date: [April 17, 2019, 12:01am UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/18 "2019-04-17T00:01:38Z")
Glad I could help you Randy, and it’s inspiring to see that you’ve still got a passion to create in your retirement.
If I could go back to when I started building my own website business and give myself one piece of advice, it would be this…
Learn how to code. Even if you don’t actually write any, and use a builder like Pinegrow to create all your sites, understanding the fundamentals of how HTML and CSS works would have saved me so much time and frustration… literally YEARS that spent kind of solving problems as they arose. It was like trying to put together a puzzle with no picture, where the pieces were all the same color. It’s possible, but so much harder. When I finally bit the bullet and just did a course from start to finish, it opened up so many possibilities, and clarified things I only vaguely understood.
---
### Author:  [@randyrie](https://forum.pinegrow.com/u/randyrie)
#### Post date: [April 17, 2019, 4:37pm UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/19 "2019-04-17T16:37:36Z")
Tks for your advice @Printninja…
Like learning any language, it really helps to converse in it than just read about it. So I am learning as I go along, paying attention to how the code works in the background (whereas I could ignore this when I had my staff coder sweating the curly brackets).
---
### Author:  [@droidgoo](https://forum.pinegrow.com/u/droidgoo)
#### Post date: [September 21, 2019, 5:44pm UTC](https://forum.pinegrow.com/t/horizontal-flyout/2904/20 "2019-09-21T17:44:08Z")
i’ve learned a lot at [https://scrimba.com](https://scrimba.com)
most of it is free, but the bootcamp has been worth paying for.
[Next page](https://forum.pinegrow.com/t/horizontal-flyout/2904.md?page=2)