I’m building a flyout menu into a webpage, and it works great, but there is a small display issue. Basically, rolling over an image will show the submenu to the right. This is done by adding in the main image and then creating a new table that contains the submenu items and simply using a class in CSS to hide the menu until the image is rolled over, then the menu is made visible. The problem is that between the main image that shows/hides the submenu and the next main menu image (which should be directly below it) there is empty space where the submenu table was created in the code. Since Ive repositioned this with CSS, this empty space is glaring and the next image down doesnt display directly underneath like I would like it to.
Ive attached my files (keep the file structure within the ZIP file), take a look and youll see what I mean.
Other than that the menu works great. I converted the menu code from a tutorial site that used a horizontal menu at the top instead, so there was no concern for this issue I’m having. Is there a workaround for this, or have I completely approached this in the wrong way?
-Jeff
[upl-file uuid=d712beb1-4c68-47a8-8fcc-128559517dc3 size=42kB]files.zip