Results 1 to 5 of 5

Thread: [CSS] Problem with height of the menu

  1. #1
    Join Date
    Nov 2007
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default [CSS] Problem with height of the menu

    Hi,
    I have a problem with the height of the drop-down menu. Menu based -> http://www.dynamicdrive.com/dynamici...witchmenu2.htm

    Code:
    .subItem
           {
           height:450px;
           width:auto;
           color:#FFFFFF;
           text-decoration:none;
           border-bottom:none 0px;
           }

    When fixing the amount 450px everything is OK:
    Examples:
    http://img171.imageshack.us/my.php?i...8094360wa8.jpg
    http://img293.imageshack.us/my.php?i...8273690wh6.jpg


    When I change 450px to auto goes something like this
    http://img515.imageshack.us/my.php?i...8670616ui5.jpg http://img300.imageshack.us/my.php?i...8240269of5.jpg

    I would like to size drop-down menu was adjusted to included content. Where the 450px, and I have two lines of content to look ugly.

    Please help in resolving the problem...

    Full code CSS
    Code:
    .navbar
       {
       }  
       
       .mainDiv
       {
    	 width:auto;
       }
       
       .topItem
       {
       width:300px;
       height:auto;
       color:#E21015;
       cursor:pointer;
       padding-bottom:5px;
       }
       
       .topItemOver
       {
    	   height: auto;
    	   width:300px;
    	   color:#E21015;
    	   cursor:pointer;
    	   padding-bottom:5px;
    	   background-color:#F00;
    	   color:#FF0;
    	   background-image:url(images/arrow_up.png);
    	   background-position:right;
    	   background-repeat:no-repeat;
       }
       
       .topItemClose
       {
       height: auto;
       width:300px;
       color: #E21015;
       cursor:pointer;
       padding-bottom:5px;
       text-decoration:none;
       border-bottom:dashed 1px;
       }
       
       
       .topItemCloseOver
       {
       height: auto;
       width: 300px;
       color: #E21015;
       cursor:pointer;
       padding-bottom:5px;
       text-decoration:none;
       border-bottom:dashed 1px;
       background-color:#000;
       color:#FF0;
       background-image:url(images/arrow_down.png);
       background-position:right;
       background-repeat:no-repeat;
       }
       
       
       
       .dropMenu
       {	
       background-color: #000;
       color: #000;
       border: 1px solid #000;
       border-width: 1px 1px 1px 1px;
       filter:alpha(opacity=100);
       padding-top:5px;
       padding-left:8px;
       }
       
       .subMenu
       {
       display:block;
       }
       
       .subItem
       {
       height:450px;
       width:auto;
       color:#FFFFFF;
       text-decoration:none;
       border-bottom:none 0px;
       }
       
       .subItem a
       {	
       border-bottom:none 0px;
       }
       
       .subItemOver
       {  
       height:auto;
       color: #FFFFFF;
       }
       
       .subItemOver  a
       {
       cursor:pointer;	
       color: #E21015;
       color:#FFFFFF;
       border-bottom:none 0px;
       }
       
       
       .drop
       {
       border-left:1px solid black;
       border-right:1px solid black;	
       }

  2. #2
    Join Date
    Jan 2008
    Posts
    4,167
    Thanks
    28
    Thanked 628 Times in 624 Posts
    Blog Entries
    1

  3. #3
    Join Date
    Nov 2007
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    thanks for help,
    with your suggestion i used http://www.dynamicdrive.com/dynamici...daccordion.htm

    But I have a problem with putting the same as the correct css on this subpage - (example)
    Current page - example

    I would like to CSS was the same as in the previous case

    Old CSS menu drop-down in first post - example

    New CSS menu
    Code:
    .technology{ 
    	cursor: pointer;
    	width:300px;
    	height:20px;
    	color:#E21015;
    }
    
    .openlanguage { 
    background-color:#F00;
    color:#FF0;
    background-image:url(images/arrow_up.png);
    background-position:right;
    background-repeat:no-repeat;
    }
    
    .closedlanguage { 
    background-color:#000;
    color:#FF0;
    background-image:url(images/arrow_down.png);
    background-position:right;
    background-repeat:no-repeat;
    }

  4. #4
    Join Date
    Jan 2008
    Posts
    4,167
    Thanks
    28
    Thanked 628 Times in 624 Posts
    Blog Entries
    1

    Default

    I'm sorry. I didn't get a word you said. Please use correct grammar.
    Jeremy | jfein.net

  5. #5
    Join Date
    Nov 2007
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    sorry for my english, I know that it is not perfect. Once again from the beginning.
    I can not set the CSS style. I would like to link visual look as in the previous case (first example) [links - system LUX, system STYL, etc.]
    Currently, they look so - example link (wzory i kolory) and screen


    I can not modify below the code CSS so links looked how in first example
    Code:
    .technology{ 
    cursor: pointer;
    width:300px;
    height:20px;
    color:#E21015;
    }
    
    .openlanguage { 
    background-color:#F00;
    color:#FF0;
    background-image:url(images/arrow_up.png);
    background-position:right;
    background-repeat:no-repeat;
    }
    
    .closedlanguage { 
    background-color:#000;
    color:#FF0;
    background-image:url(images/arrow_down.png);
    background-position:right;
    background-repeat:no-repeat;
    }

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
  •