User Name Password Register
DaniWeb IT Discussion Community
All
What is DaniWeb IT Discussion Community?
You're currently browsing the HTML and CSS section within the Web Development category of DaniWeb, a massive community of 391,956 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 3,882 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Please support our HTML and CSS advertiser: Lunarpages Web Hosting

In navigation display:block; property is giving problem in IE6

Join Date: Jan 2008
Posts: 1
Reputation: designer21 is an unknown quantity at this point 
Rep Power: 0
Solved Threads: 0
designer21 designer21 is offline Offline
Newbie Poster

Help In navigation display:block; property is giving problem in IE6

  #1  
Jan 31st, 2008
Hello

I have a navigation vertical bar on left hand side. I want to use two different text on one button in one line. first text should be align to left and second text align to right under that div. problem is in IE6, second text is coming down.in mozilla its working fine. i cannot fix width of bothe text because right text increases according to database vale.

In IE6 it is giving problem because of display:block property, if i removed dispaly:block property then text is coming in one line but on hover i want to change full square color of that link.

Here is the code
div#west {                
    background: #EBEEF2 url(../images/navi_shadow.gif) repeat-y right; width:172px;
    height: 100%;}

.left_selected { display:block; width:165px; height:32px; text-decoration:none;  background: url(../images/nav_Vbg.png) repeat-y right; text-indent:9px; font: bold 11px/28px Tahoma, Arial, Helvetica, sans-serif; color:#000;}

.leftnav {background: #EBEEF2; font: normal 11px/28px Tahoma, Arial, Helvetica, sans-serif; color: #004C85; text-decoration:none; text-indent:9px; vertical-align:top; display:block; width:165px; height:30px; border-top: 1px solid #fff; border-bottom: 1px solid #ccc;}

.leftnav a{background: #EBEEF2; font: normal 11px/28px Tahoma, Arial, Helvetica, sans-serif; color: #004C85; display:block; text-decoration:none; text-indent:9px; vertical-align:top; width:165px; height:30px;}

.leftnav a:hover{background: #fff url(../images/nav_Hbg.png) repeat-y right; color: #004C85; text-decoration:none; display:block; text-indent:9px; vertical-align:top; width:165px; height:30px;}

.left_bar_num {
    font-family: Tahoma;
    font-size: 11px;                
    color: #333333;
    float:right;
}

HTML Code:
<div id="west">
<div class="leftnav"><a href="#">Job Search<span class="left_bar_num">32</span></a></div>
<div class="leftnav"><a href="#">Find Traveler<span class="left_bar_num">5|232</span></a></div>
</div>
</div>

Hope you will understand the probelm. i am first time using this forum site.

Thanks in advance.
AddThis Social Bookmark Button
Reply With Quote  
All times are GMT -4. The time now is 9:06 am.
Forum system based on vBulletin Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
©2003 - 2008 DaniWeb® LLC