Results 1 to 6 of 6

Thread: CSS menu is "loosing" width, why?

  1. #1
    Join Date
    Jul 2005
    Posts
    29
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default CSS menu is "loosing" width, why?

    Hi people

    I have a little problem. If you take a look on this url:
    http://titties.homepage.dk/front.html

    You an see i have a menu.

    If you then click on the menu-link called "Bestyrelsen":
    http://titties.homepage.dk/bestyrelsen.html

    You'll notice that the menu width has been reduced. This actually ruins the "design" if you move your mouse over the menu-link called "Konservative Værker".

    Apperently it is the table that sort of puyshes the menu; how can I prevent that?

    Thanks for your time.

    Tissie

  2. #2
    Join Date
    Jul 2006
    Location
    Canada
    Posts
    2,581
    Thanks
    13
    Thanked 28 Times in 28 Posts

    Default

    I just tested it in IE and Mozilla. I didn't see anything wrong
    - Mike

  3. #3
    Join Date
    Jul 2005
    Posts
    29
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Seriously?

    Ok, on the "Forside" page, move your mouse over the "Konservative Værker" menu-point. Then you'll see a hover bar with a little logo on the right side.

    If you then do the same thing, but just on the "Bestyrelsen" page, then you'll see that the logo is now, due to "loosing" width, covering the "r" on "Konservative Værker"


    Correct?

    Note: I use IE myself

  4. #4
    Join Date
    Jul 2005
    Posts
    29
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Ok, I've just had a few friends of mine to confirm; and there's an error.

    How do I prevent this, I've set my menu width to 200 px, but I dont understand, why it makes it smaller on the page, with the table...

  5. #5
    Join Date
    Dec 2004
    Location
    UK
    Posts
    2,358
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by Titties
    Apperently it is the table that sort of puyshes the menu; how can I prevent that?
    Writing modern markup is a good way to start.

    When authoring to the Strict DTD, one should use semantic markup. The only semantic elements that I can see anywhere in your content is a few paragraphs (p elements) and two anchors. The latter - the two validation links at the end of the document - have dubious value: though one should write valid markup, the end-user neither needs to know nor care.

    Some tips:

    • Use decent titles. The title element for each document should contain a short but unambiguous indication of where the user is within the site. The level one heading (h1 element) within the document body should provide the complete title, though it needn't be quite so unique. A title should include: the name of the site; the name of the section or region, such as "Products" or "Reviews", in a large site; and the document heading, shortened if necessary. Remember that there is only limited space in which to render a title (and don't just consider desktops).
    • Use real source anchors (links). Relying on client-side scripting to provide navigation is a terrible idea. Not only will it fail in unscriptable user agents, including search engine indexers, but it interferes with standard user interface features that users should expect to be able to use.
    • Use semantic markup. In your current documents, you use a sequence of div elements to represent a list of links, rather than a list containing source anchors. Similarly, rather than using headings (hx elements), you use styled div elements, instead.
    • Don't use forced line-breaks (br elements) to effect vertical spacing. The br element is meant to break a line, just as you might find in poetry, song lyrics, and postal addresses. If you need to add spaces between lines within the same block-level element (like a paragraph), use the line-height CSS property. If you need to separate block-level elements, use margins (also CSS).
    • Don't use tables to provide layout. Tables are meant to designate tabular data: information in which items in the same row or column have a specific relationship. It is rare that CSS cannot achieve the same layout as a table, and, given the flexibility of CSS, the latter should be avoided for presentational purposes.
    • Don't use markup comments (<!-- -->) in embedded style sheets or scripts; this became unnecessary years ago.

    Mike

  6. #6
    Join Date
    Jul 2005
    Posts
    29
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thx for your thorough reply, mike.

    I'll return to this thread in a couple of days.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •