Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Page 1 of 2 1 2 LastLast
Results 1 to 10 of 17
  1. #1
    Member
    Join Date
    May 2004
    Posts
    76
    Member #
    5925
    Im having trouble with getting the nested divs to display properly in Netscape, and mozilla (works fine in IE). The problem is the line-break <br /> has no effect on the menu items that are in divs. Both of these divs are nested in a table that controls the width and height of the menu.

    Here is my code for the nested divs
    Code:
    <div class="menubackground">
    <div style="background: #000094; color: #FFFFFF; text-align: center; font-family: verdana; font-weight: bold; font-size: 80%;">Header 1</div>
    <a class="UpperLeftLink UpperLeftActive UpperLeftVisited UpperLeftHover" href="index.asp"> Empty</a></br />
    <a class="UpperLeftLink UpperLeftActive UpperLeftVisited UpperLeftHover" href="index.asp"> Empty</a><br />
    <a class="UpperLeftLink UpperLeftActive UpperLeftVisited UpperLeftHover" href="index.asp"> Empty</a><br />
    <a class="UpperLeftLink UpperLeftActive UpperLeftVisited UpperLeftHover" href="index.asp"> Empty</a><br />
    </div>

  2.  

  3. #2
    Senior Member
    Join Date
    Dec 2003
    Posts
    1,274
    Member #
    4362
    I've never seen before to put various classes to the same item, instead create a class in the CSS stylesheet and do something like this:
    Code:
    .class1 {
      blahblah
    }
    .class1:active {
      blahblah
    }
    .class1:visited {
      blahblah
    }
    .class1:hover {
      blahblah
    }

  4. #3
    Member
    Join Date
    May 2004
    Posts
    76
    Member #
    5925
    Are you referring to the links, or the divs that I didn't make a class for? Anyways, do you have idea why nothing effects stuff inside the div for netscape, and mozilla?

  5. #4
    Senior Member Aleister's Avatar
    Join Date
    Jul 2003
    Location
    Texas
    Posts
    250
    Member #
    2329
    Try something like this:

    html:
    Code:
    <div class="menu">
    	<div class="header1">Header 1</div>
    
    	<a href="index.asp"> Empty</a><br>
    	<a href="index.asp"> Empty</a><br>
    	<a href="index.asp"> Empty</a><br>
    	<a href="index.asp"> Empty</a><br>
    </div>
    the css:
    Code:
    .menu {
        /* put all the css from menubackground here */
    }
    .menu a:link {
        /* put all the css from UpperLeftLink here */
    }
    .menu a:active {
        /* put all the css from UpperLeftActive here */
    }
    .menu a:visited {
        /* put all the css from UpperLeftVisited here */
    }
    .menu a:hover {
        /* put all the css from UpperLeftHover here */
    }
    .header1 {
        /* put all the css for the header here */
    }
    This will use .menu for the position etc.. but will also specify the look of the links that are in it. It makes much more sense to use the div itself to tell the browser how things inside will look, rather than giving the look to the objects (in this case links) themselves. make sense? This is just a basic example, it could be optimized quite a bit but it works.
    The Temple of Dagon | Dagon Design
    "That is not dead which can eternal lie, And with strange aeons even death may die." - HPL

  6. #5
    Member
    Join Date
    May 2004
    Posts
    76
    Member #
    5925
    Thx for the tip, it saved a lot of unnecessary code. The problem with <br /> not effecting menu items in the div is still there. This is a really strange problem I keep running into with netscape, and mozilla; Everything you throw at IE seems to work (even if it's coded incorrectly).

    I could use tables to get around this problem, but I would prefer to find out why divs are not working. Any help is appreciated.

  7. #6
    Senior Member Aleister's Avatar
    Join Date
    Jul 2003
    Location
    Texas
    Posts
    250
    Member #
    2329
    Will you post the css that is used ? I think it might be something in that.
    The Temple of Dagon | Dagon Design
    "That is not dead which can eternal lie, And with strange aeons even death may die." - HPL

  8. #7
    Senior Member Aleister's Avatar
    Join Date
    Jul 2003
    Location
    Texas
    Posts
    250
    Member #
    2329
    make sure you don't have "display: inline" in the link declarations for .menu (or whatever its called). That would force each to be on the same line.
    The Temple of Dagon | Dagon Design
    "That is not dead which can eternal lie, And with strange aeons even death may die." - HPL

  9. #8
    Member
    Join Date
    May 2004
    Posts
    76
    Member #
    5925
    This the css for the menu class.

    Code:
    .menu {
    background: #DDDDDD;
    color: #000000;
    margin: 0px;
    padding: 0px;
    text-align: center;
    border-left: solid;
    border-left-color: #000000;
    border-left-width: thin;
    border-right: solid;
    border-right-color: #000000;
    border-right-width: thin;
    border-top: solid;
    border-top-color: #000000;
    border-top-width: thin;
    border-bottom: solid;
    border-bottom-color: #000000;
    border-bottom-width: thin;
    }
    
    .menu a:link {
    background: none;
    color: #000000;
    font-family: verdana;
    font-size: .70em;
    text-decoration: none;
    }
    
    .menu a:visited {
    background: none;
    color: #000000;
    font-family: verdana;
    font-size: .70em;
    text-decoration: none;
    }
    
    .menu a:hover {
    background: #DFFFFF;
    color: #000000;
    font-family: verdana;
    font-size: .70em;
    text-decoration: none;
    }
    
    .menu a:active {
    background: none;
    color: #000000;
    font-family: verdana;
    font-size: .70em;
    text-decoration: none;
    }

  10. #9
    Senior Member Brak's Avatar
    Join Date
    Apr 2003
    Location
    San Francisco, CA
    Posts
    3,413
    Member #
    1217
    Liked
    2 times
    You should change those .menu a:link etc to a.menu:link That's just wrong what you've got there
    Kyle Neath: Rockstar extraordinare
    The blog | The poetry site | The Spore site

  11. #10
    Member
    Join Date
    May 2004
    Posts
    76
    Member #
    5925
    Strange thing is it works the way I have it(.menu a:link). I tried changing it to the way you have it(a.menu:link), but then the formating doesn't work on any browser, including IE.


Page 1 of 2 1 2 LastLast

Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 07:35 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com