Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

width:auto - not working in ie7

Posted on 2009-04-28
2
Medium Priority
?
3,022 Views
Last Modified: 2012-05-06
hi,

the top nav in this example:

http://cjehost.com/orthoneuro/

<ul id="TJK_dropDownMenu">
<li id="AB"><a href="default.asp">Home</a>
</li>
<li id="pipe">|</li>
<li id="AB"><a href="AD.asp">About OrthNeuro</a>
  <ul>
<li><a href="#">History</a></li>
<li><a href="#">Hospital Affliliations</a></li>
<li><a href="http://www.newalbanysurgicalhospitalfoundation.com" target="_blank">Nash Foundation</a></li>
</ul>
</li>
</ul>

displays the way i want it to: subanchor <li>s are all the same width and text is centered - i'm using width:auto to achieve this.

#TJK_dropDownMenu li ul {
      width:auto; !important;/* leaves room for padding */
      cursor:default;
      position:absolute;
      height:auto;
      display:none;
      left:-11px;
      padding:0 10px 10px 10px;
      background:url(images/spacer.gif);/* trick to keep'em open */
}

however, width:auto isn't doing the trick in ie7 - again:

http://cjehost.com/orthoneuro/

is there a work around? - the code snippet contains all the pertinent styles.




/* sub-menu ULs */
#TJK_dropDownMenu li ul {
	width:auto; !important;/* leaves room for padding */
	cursor:default;
	position:absolute;
	height:auto;
	display:none;
	left:-11px;
	padding:0 10px 10px 10px;
	background:url(images/spacer.gif);/* trick to keep'em open */
}
/* All LIs */
#TJK_dropDownMenu li {
	position:relative;
	/*width:8.30em;*/
	/*max-width:16.5%;*/
	cursor:pointer;
	float:left;
	list-style-type:none;
	font-weight:bold;
}
/* sub-menu LIs */
#TJK_dropDownMenu li ul li {
	width:100%/*FF*/;/*this width is not effecting sub lis in ie*/
	padding:0;
	border:none;
	max-width:200%;
	border:1px solid #fff;
	border-top:none;
	
}
/* All anchors */
#TJK_dropDownMenu li a {
	cursor:pointer;
	color:#fff;
	/*border-right:1px solid #fff;*/
	text-decoration:none;
	display:block;
	float:left;
	padding:3px 4px 0 4px;
/*  uncomment the declaration below if you want to go "full width" */
/*	width:7.47em; */
	height:1.8em;/*HEIGHT FOR MAIN NAV*/
	line-height:1.5em;
	/*background:#99FFCC;*/
	
}
/* | */
#TJK_dropDownMenu li#pipe {
	cursor:default;
	color:#fff;
	/*border-right:1px solid #fff;*/
	text-decoration:none;
	display:block;
	float:left;
	padding:3px 0 0 0;
/*  uncomment the declaration below if you want to go "full width" */
/*	width:7.47em; */
	height:1.8em;/*HEIGHT FOR MAIN NAV*/
	line-height:1.5em;
	/*background:#99FFCC;*/
	
}
/*LAST ANCHOR ON RIGHT*/
#TJK_dropDownMenu li#last_nav a {
	cursor:default;
	color:#fff;
	text-decoration:none;
	display:block;
	border-right:solid 0;
	float:left;
	padding:0 7px;
/*  uncomment the declaration below if you want to go "full width" */
/*	width:7.47em; */
	/*height:2em;*/
	line-height:1em;
	
}
/* sub-menu Anchors */
#TJK_dropDownMenu li ul li a {
	width:100%/*FF*/;
	position:relative !important; /* ie Mac */
	float:left;
	cursor:pointer !important;
	white-space:nowrap;
	line-height:1.7em;
	height:1.7em;
	font-weight:normal;
	border:1px solid #fff;
	color:#fff;
	background-position:0 50% !important;
}

Open in new window

0
Comment
Question by:phillystyle123
2 Comments
 
LVL 43

Expert Comment

by:David S.
ID: 24254535
I don't see that menu? Perhaps you meant to provide the URL for a different page?
0
 

Accepted Solution

by:
phillystyle123 earned 0 total points
ID: 24254569
Hey Kravimir - thanks for responding-  i got tired of messing with that menu and opted to just use dw drop downs for now - too much hassle - i'm going to delete the question.

thanks again,
phillystyle
0

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When writing CSS, there are a few simple rules that will make your life easier.    1. Using ‘* {box-sizing:border-box;}’. Using this will wrap all your elements in a nice little compact box-model that will give you the width you want, like so... …
The first step to building an amazing About page is to figure out what you want the page to say about your company. You then must grab the attention of the reader, boast a bit, tell a story and let others brag about you. With a little bit of thought…
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …
Suggested Courses
Course of the Month15 days, 17 hours left to enroll

580 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question