Fixing website menu

Hello there,
I'm looking for a little assistance in aligning my website menu properly. Made a new 1024 layout in photoshop and imported it to dreamweaver. I got all my pages made, except that the long pages break the menu and pulls it apart.
I know a long time ago when I learned this stuff the was a little line of code to align the pieces back to the top, so the menu isn't broken.
I have tried the valign="top" attribute both with in the <td> and <tr> tags to align the images to the top
heres my example: boats4u.okanaganboating.com/faq.html
Can anybody please help me out? would be much appreciated! thanks!

INM_skipper wrote:
Thank you again Hans! Looks like you found the fix for aligning the menu. May I as what changes you made? I had a look at the page source of the doc you provided and I didn't see the difference between mine and yours? I was also trying to align my menu to the top as well, but am having difficulty with that as well... got any suggestions for that?
Letting Photoshop produce the html is possibly the worst way you can ever construct a webpage.
The reason being it produces code which is full of row and col spans, which you do not want as these can distort your construction.
What you need to do is clear the first column of your table of these unwanted and unecessary row/column spans and then insert an 'independent' table in that column to house your menu. Being that the table is 'independent' it will not be joined to any other table cell on your page, which row and column spans do, thus when this occurs and you fill your table cells with content the joined cells get pulled along for the ride as well.
Simplify your html table construction for your own peace of mind. If you don't you are walking headlong into a nightmare.
Using tables for constrcution is also a bit outdated now so if this is a new website the method you are using is old before its time even begins

Similar Messages

Can't see my website menu on SAFARI

Hi everybody, I am debeloping a website using CSS, I have a problem with my safari., It doesn't show the menu, If I go to any PC and browse with safari it work, but with mac it doesn't, I can see the menus of my website with firefox also, this is the link... http://www.demo.kelownamountainbridges.com/
Maybe someone here can help me out with this, I am pretty much new with website development and starting with Mac, thanks alot

http://www.apple.com/osx/whats-new/
Footnote 6 says "iCloud Tabs on iPhone, iPad, and iPod touch requires iOS 6."

How to fix Spry Menu bar and Firefox with a Mac

The spry menu bar does not properly display in Firefox (Version11&12) on a mac. Have looked at a number of different ways to fix this. Included is a copy of css for menu bar. Would appreciate any suggestions.
/* The outermost container of the Menu Bar, an auto width box with no margin or padding */
ul.MenuBarHorizontal
          margin: 0;
          padding: 0;
          list-style-type: none;
          font-size: 100%;
          cursor: default;
          width: auto;
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
          z-index: 1000;
/* Menu item containers, position children relative to this container and are a fixed width */
ul.MenuBarHorizontal li
          margin: 0;
          padding: 0;
          list-style-type: none;
          font-size: 100%;
          position: relative;
          text-align: left;
          cursor: pointer;
          width: 11em;
          float: left;
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
          margin: 0;
          padding: 0;
          list-style-type: none;
          font-size: 100%;
          z-index: 1020;
          cursor: default;
          width: 11em;
          left: -1000em;
          position: relative;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
          left: auto;
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
          width: 11em;
          float: none;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
          position: absolute;
          margin: -5% 0 0 95%;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
          left: auto;
          top: 0;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
          /* [disabled]border: 1px solid #CCC; */
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
          display: block;
          cursor: pointer;
          background-color: #FFFFCC;
          padding: 0.5em 0.75em;
          color: #4F8627;
          text-decoration: none;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
          background-color: #FFFFCC;
          color: #4F8627;
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
          background-color: #FFFFCC;
          color: #4F8627;
SUBMENU INDICATION: styles if there is a submenu under a given menu item
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenu
          background-image: url(SpryMenuBarDown.gif);
          background-repeat: no-repeat;
          background-position: 95% 50%;
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
          background-image: url(SpryMenuBarRight.gif);
          background-repeat: no-repeat;
          background-position: 95% 50%;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
          background-image: url(SpryMenuBarDownHover.gif);
          background-repeat: no-repeat;
          background-position: 95% 50%;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
          background-image: url(SpryMenuBarRightHover.gif);
          background-repeat: no-repeat;
          background-position: 95% 50%;
BROWSER HACKS: the hacks below should not be changed unless you are an expert
/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
          position: absolute;
          z-index: 1010;
          filter:alpha(opacity:0.1);
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
          ul.MenuBarHorizontal li.MenuBarItemIE
                    display: inline;
                    f\loat: left;
                    background: #FFF;

Change
ul.MenuBarHorizontal ul
          margin: 0;
          padding: 0;
          list-style-type: none;
          font-size: 100%;
          z-index: 1020;
          cursor: default;
          width: 11em;
          left: -1000em;
          position: relative;
to
ul.MenuBarHorizontal ul
          margin: 0;
          padding: 0;
          list-style-type: none;
          font-size: 100%;
          z-index: 1020;
          cursor: default;
          width: 11em;
          left: -1000em;
          position: absolute;
Gramps

Website Menu Creation Software

Does anyone have a good solid recommendation for DHTML menu software? I've been using Sothink for many years now, however with the latest release I'm having serious registration and usability issues and their tech support is hideous. I'm not looking for something simple for novices. I've been designing and building websites for 20 years and know my way around code; I just prefer a program that does most of the leg work for me. Also I don't really care if it can act as a plugin to Dreamweaver or not, a stand alone program is prefectly fine. Any suggestions would be greatly appreciated.

IMO the best commercial extensions for Dreamweaver are found at Project Seven.
http://www.projectseven.com/products/menusystems/pmm2/
PVII pays attention to web standards & accessibility so their menus work on iPhone/iPads, etc...
Also if you ever need it, their customer support is top notch. A+++
Incidentally, I don't work for PVII but I've used their products for years.
Nancy O.

Browser websites menu missing,found my tools and history,was told to press Alt and vr?

lost my tools,history menu and website browser menu.Asked advice got tools back but website browser is still missing.Have tried support help was told to press Alt and vr together cannot find vr button?.

You press the Alt key, and then the V key, followed by T and finally M
For more details see [[menu bar is missing]].

Fix Lion menu bar and dashboard graphics

Hello,
I recently upgraded my MacBook Pro to Lion a few months back. About 3 weeks ago, on one of the three user acccounts, the menu bar and dashboard got messed up. See images below. I was looking to find a solution, but could not find any. As I mentioned only one user account has been affected.
Any suggestions on how to fix this?
Thanks!
See menu bar:
See dashboard

Below please find the output from the Terminal commands.
USERS-MacBook-Pro:~ user$ kextstat -kl | awk ' !/apple/ { print $6 $7 } '
org.virtualbox.kext.VBoxDrv(4.1.6)
org.virtualbox.kext.VBoxUSB(4.1.6)
org.virtualbox.kext.VBoxNetFlt(4.1.6)
org.virtualbox.kext.VBoxNetAdp(4.1.6)
USERS-MacBook-Pro:~ user$ sudo launchctl list | sed 1d | awk ' !/0x|apple|com\.vix|edu\.|org\./ { print $3 } '
com.leapfrog.connect.shell
com.google.keystone.daemon
com.crashplan.engine
com.adobe.SwitchBoard
USERS-MacBook-Pro:~ user$ launchctl list | sed 1d | awk ' !/0x|apple|edu\.|org\./ { print $3 } '
com.wacom.pentablet
com.google.keystone.root.agent
com.adobe.CS5ServiceManager
com.zimbra.desktop
com.adobe.AAM.Scheduler-1.0
USERS-MacBook-Pro:~ user$ ls -1A {,/}Library/{Ad,Compon,Ex,Fram,In,La,Mail/Bu,P*P,Priv,Qu,Scripti,Servi,Sta}* 2> /dev/null
/Library/Components:
/Library/Extensions:
EyeOne.kext
VBoxDrv.kext
VBoxNetAdp.kext
VBoxNetFlt.kext
VBoxUSB.kext
/Library/Frameworks:
AEProfiling.framework
AERegistration.framework
Adobe AIR.framework
AudioMixEngine.framework
Frameworks
MacFUSE.framework
NyxAudioAnalysis.framework
PluginManager.framework
TSLicense.framework
/Library/Input Methods:
/Library/Internet Plug-Ins:
DirectorShockwave.plugin
Flash Player.plugin
Flip4Mac WMV Plugin.plugin
JavaAppletPlugin.plugin
Quartz Composer.webplugin
QuickTime Plugin.plugin
Silverlight.plugin
Unity Web Player.plugin
Unused
WacomNetscape.plugin
WacomSafari.plugin
flashplayer.xpt
iPhotoPhotocast.plugin
nsIQTScriptablePlugin.xpt
/Library/LaunchAgents:
com.adobe.AAM.Updater-1.0.plist
com.adobe.CS5ServiceManager.plist
com.google.keystone.agent.plist
com.wacom.pentablet.plist
/Library/LaunchDaemons:
com.adobe.SwitchBoard.plist
com.apple.remotepairtool.plist
com.crashplan.engine.plist
com.google.keystone.daemon.plist
com.leapfrog.connect.shell.plist
/Library/PreferencePanes:
Flash Player.prefPane
Flip4Mac WMV.prefPane
Growl.prefPane
MacFUSE.prefPane
PenTablet.prefPane
Tuxera NTFS.prefPane
/Library/PrivilegedHelperTools:
com.leapfrog.connect.shell
/Library/QuickLook:
GBQLGenerator.qlgenerator
iWork.qlgenerator
/Library/QuickTime:
AppleIntermediateCodec.component
AppleMPEG2Codec.component
Flip4Mac WMV Advanced.component
Flip4Mac WMV Export.component
Flip4Mac WMV Import.component
/Library/ScriptingAdditions:
Adobe Unit Types.osax
/Library/StartupItems:
VirtualBox
Library/Address Book Plug-Ins:
SkypeABDialer.bundle
SkypeABSMS.bundle
Library/Input Methods:
Library/Internet Plug-Ins:
Library/LaunchAgents:
com.adobe.AAM.Updater-1.0.plist
com.apple.FolderActions.enabled.plist
com.apple.FolderActions.folders.plist
com.zimbra.desktop.plist
Library/PreferencePanes:
.4C754951EC7660CCD85F
USERS-MacBook-Pro:~ user$

Code to fix website getting cut off

Does anyone know the source code for fixing the website created on muse from being cut off, so it can show fully without cutting any part of my website off. Its been driving me crazy the whole day. I've tried all solutions possible for fixing it on muse but nothing works.

BTW, I think this issue may be specific to 480i widescreen material viewed through non-HDMI inputs. I was in a Best Buy today, and didn't see any difference with this TV versus other TVs with whatever materal was being played back through all the TVs, but I believe this was because they were feeding an actual HD signal (greater than 480 pixels in height) via through the antenna input.
Anyway, I'm thinking of returning this TV and taking my chances on <gasp> an Insignia 28" class LED backlit TV. I really think Toshiba is a better brand (or at least was), but this issue of the sides getting slightly cut off (as explained in the original post) is kind of annoying. It's too bad Toshiba hasn't indicated they will address/fix this issue.
Jeff

Website menu not correct show wit ipad/imac

Dear sir,
This is mayby not the wright place to ask this question (sorry).
The website www.a2models.nl is shown correct in all browsers on a pc, buth when I look with an ipad/imac with safari, the end of the horizontal menu moves below.
The homepage in Dutch and English is made with Dreamweaver. I integrated a webshop from Mijn Webwinkel (Logivert).
The layout.html is made by a webshopdevelopper, but can't/won't help me, because I've made a little change in the layout (only a horizontal menu in red).
The container is 700px I've tried to make it bigger but it didn't help or made the with auto which also didn't help.
Took some space but this didn't help.
What am I doing wrong?
Thank you verry much for your reply.
Carla

Not much to go on there.
You basically said it is broken with no link to see it , no information on how it is built or anything
Literrally could be 100's of reason for incorect css, malformed html, javascript error and more.
You need to at least post a link so people can take a look.

Problems with touch on website menu

I have an ipad and on a center webpage when i touch with my finger on EMPTY space, it triggers the menu that lies ABOVE the empty space.
For example the SIDE MENU on: www.expus.gr/products/Mobile_Accessories
This happens on Safari and on Chrome (didn't try any other browsers).
Any Ideas?

I was just browing around the forums when I found this in a super long forum:
http://forums.lenovo.com/t5/ThinkPad-Edge-S-series/Lenovo-Twist-touchscreen-issues-after-sleeping/m-...
The download seems to have fixed most of the problem. However, you would think Lenovo would make this update more readily available to users. Instead, I have to go to this forum and download this file myself.

Fixed Website Window

Hello. I'm going crazy trying to find an answer to my
question. I'm trying to adjust a site that has a fixed left side.
It's the type of site that allows you to expand the browser window
to the right, exposing just blank space. I'm interested in a fixed
window that does not expand - that does not have a horizontal
scrolling bar (that is, unless you shrink it). How do I do this?
I've been googling like mad, but all I find is the fixed or fluid
debate tidbits. This doesn't address my question, of course.
Thanks.

> How do I set the browser window at a fixed width
You don't - you can't (at least not reliably in all
browsers). Does that
answer the question?
> I don't want the user to expand
> the browser window horizontally to the left.
But - I can't do that. I can drag to the right from the right
margin, or to
the left from the left margin, but the behavior of your
current page would
be the same in either case. The page is snug with the left
margin and you
get a wider gutter on the right. That's because the page is
fixed width
with no alignment specified so it gets the default of left
alignment.
> I've enjoyed the AP boxes because they allow me to
design the
> page with absolute certainty - is it that I'm using too
many?
Which is why everyone that uses them inappropriately does so.
The problem
with using absolutely positioned elements as a primary layout
tool is well
explained here -
http://apptools.com/examples/pagelayout101.php
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"galleryrx" <[email protected]> wrote in
message
news:[email protected]...
> Murray *ACE*, thanks for your thoughts. I am working
with a template. The
> website is not yet doing what I want because I don't
want the user to
> expand
> the browser window horizontally to the left. How do I
set the browser
> window at
> a fixed width. I've enjoyed the AP boxes because they
allow me to design
> the
> page with absolute certainty - is it that I'm using too
many? And
> regarding the
> flash header and the navigation bar, this came with the
template. This
> will
> actually appear as static html with the option of a
flash movie. I know
> this
> isn't the best solution, but the html navigation will be
there for
> accessibility issues and for iphone use. So, I'm still
trying to figure
> out the
> window width situation.
>

[FIXED] Openbox - menu won't change no matter what i do..grrr..

Hi, I can't seem to be able to change the openbox menu, whether by manual edit thru menu.xml or using the graphical end obmenu. Restart PC, openbox --reconfigure, openbox --restart, nothing seems to be working.
_xinitrc_
http://pastebin.com/tNCQ5MXT
_menu.xml_
http://pastebin.com/juhvhCV3
_My current ugly not working openbox menu_
http://i.imgur.com/xiIuLK6.png
thanks guys.
Last edited by MrPotato (2014-01-06 13:41:28)

Ha-ha! What do you know it worked. Dude you're awesome, thanks! If you don't mind I'm asking, what went wrong the first time?
Last edited by MrPotato (2014-01-06 13:40:44)

How do you fix website if it looks different in different browsers?

The layout of my site changes depending on what browser you are using. I would greatly appreciate any advice on how to fix this!
http://tiremanagementinc.com/
Thank you!

Don't bother - the code is relatively valid. Your problem is just the layout methods you have used (negative margins, absolute positioning, paragraph tags for spacing, aligning foreground content with background images, etc.). And the problem there is that your CSS is so verbose, and a bit obscure (class="L"?), that troubleshooting is not easy.
I think you would do well to try this layout again, and migrate your content over to the new attempt. Try to follow the concepts outlined here - http://www.apptools.com/examples/pagelayout101.php and here -
HTML & CSS Tutorials - http://w3schools.com/
How to Develop with CSS?
http://phrogz.net/css/HowToDevelopWithCSS.html
Learn CSS positioning in 10 Steps
http://www.barelyfitz.com/screencast/html-training/css/positioning/
========================================
PRE-BUILT CSS LAYOUTS
For rock solid, commercial products that perform well in all browsers/devices, visit Project Seven:
http://www.projectseven.com/products/index.htm
Not Just a Grid CSS Framework (free)
http://www.notjustagrid.com/demo.asp
Ultimate Multi-Column Layouts (free)
http://matthewjamestaylor.com/blog/ultimate-multi-column-liquid-layout s-em-and-pixel-widths
EZ-CSS Templates (watch the screencast to see how it works)
http://www.ez-css.org/css_templates
Dreamweaver CSS Templates for beginners (free)
http://www.adobe.com/devnet/dreamweaver/articles/dreamweaver_custom_te mplates.html
New DW Starter Pages (free)
http://www.adobe.com/devnet/dreamweaver/articles/introducing_new_css_l ayouts.html

How to create a responsive website menu?

We’re looking to create a responsive menu that adjusts from a full size horizontal menu (with 6 items) to a dynamic single menu (not a select box, but a dynamic menu).
EG:
full size menu: home, services, products, about, contact, etc
The phone menu would have “Menu” and everything would be a dynamic drop down from that.
Is this built in, any templates out there and/or is this doable?

The Edge Commons library will get you headed down the right path, in terms of different layouts for different devices.
http://tv.adobe.com/watch/learn-edge-animate/flexible-layouts-using-adobe-edge-animate-and -the-edge-commons-library/
https://github.com/simonwidjaja/EdgeCommons
You could also build a menu for desktop/mobile. Then check browser size with this:
$(window).width();
or use a library like modernizr to check capabilitie (touch for example): http://www.modernizr.com/
You could then use jQuery show/hide to display the appropriate menu.

[SOLVED] Any Ideas on how to fix program menu font?

Hey guys,
For some reason the greyed out items on menu's does dont display correctly and I cannot seem to figure out what the problem is.
I am using awesome window manager with I think it was the lain theme pack. I have tried changing to various fonts in the theme.lua and .Xresources but neither seem to make any difference.
If you look at the top box "save comment" and "save color value from transparent pixels" options this is what I am talking about.
http://i.imgur.com/IkSEYA4.jpg
Moderator edit [ewaller] converted over sized image to a link https://wiki.archlinux.org/index.php/Fo … s_and_Code
Last edited by life617 (2014-05-17 00:33:38)

that has nothing to do with your window manager settings or .Xresources settings.
The window in screenshot appears to gimp if I'm not mistaken, which uses gtk2, so you should look into changing its theme/font settings: https://wiki.archlinux.org/index.php/GTK+

How do I fix FF4 menu fonts that are faded or fuzzy

I have successfully used FF3xx for a long time with W7 x64 and a Radeon HD5770 video card. After installing FF4 the text in menus and bookmarks in faded and fuzzy. After removing FF4 and reinstalling FF3xx the problem persists. Problem resolved by restoring system from backup prior to FF4 install.

Try this addon, it might help: https://addons.mozilla.org/en-US/firefox/addon/anti-aliasing-tuner/

Fixing website menu

Similar Messages

Maybe you are looking for