We help IT Professionals succeed at work.

Check out our new AWS podcast with Certified Expert, Phil Phillips! Listen to "How to Execute a Seamless AWS Migration" on EE or on your favorite podcast platform. Listen Now

x

Safari and Chrome Rendering Problem

sharingsunshine
on
Medium Priority
437 Views
Last Modified: 2012-05-11
I have a div that renders fine in the other browsers.  However, in Safari or Chrome the text decoration isn't near the item it is spread to the far left instead.

<div class="navbox2col_longer_index">
  <div class="links_navbox_left_longer_index">
    <ul class="leftnav3_navbox_left">
      <li class="leftnav3_navbox_left"><img src="/Resources/nsp_logo.gif" class="centered" /></li>
      </ul>
 </div>
      
<div class="links_navbox_right_longer_index">
<ul class="leftnav3_navbox_right_index">

<li class="leftnav3_navbox_right_index">Wholesale Prices Always</li>
<li class="leftnav3_navbox_right_index">Fast Shipping! <br />
                Leaves 1 of 4 warehouses within 24 hours M-F</li>
<li class="leftnav3_navbox_right_index">Quality - Nature's Sunshine</li>
<li class="leftnav3_navbox_right_index">Fresh - No Old Inventory <br />
                We ship from the manufacturer</li>
      
    </ul>
  </div> 
</div>

Open in new window


you can see it at http://www.theherbsplace.com/test_browser.html

div.navbox2col_longer_index {
	margin: 0px;
	padding:0px; /* This pads the links in the rightmenu */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #0000FF;
	font-weight: bold;
	text-align:left;
	overflow: hidden;
	background-color:#FFFFff;
	position: relative;
	margin:0 auto;
	width:550px;
	padding-top:6px;
	padding-bottom:6px;
	margin-top:6px;
}
.links_navbox_left_longer_index {
margin:0px;
padding:0px;
float:left;
width:180px;
padding-right:10px;
}

ul.leftnav3_navbox_left {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	margin:0 auto;
	text-align:center;
}
li.leftnav3_navbox_left {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	text-align:center;
	margin:0 auto;
}
.centered {
margin:0 auto;
text-align:center;
}
.links_navbox_right_longer_index {
margin:0px;
padding:0px;
float:right;
width:350px;
}
li.leftnav3_navbox_right_index {
	padding: 0px;
	margin:0;
	margin:0 auto;
	text-align:center;
	padding-top:1px;
	color:#336633;
	background-color:#FFF;
	margin-bottom:11px;
	}
ul.leftnav3_navbox_right_index {
	margin: 0px;
	padding: 0px;
	margin:0 auto;
	text-align:center;
	margin-top:11px;
}

Open in new window

Comment
Watch Question

Commented:
my Google Chrome (10.0.648) rendered it exactly as Firefox did (4)

Author

Commented:
I am using vmware and I have the same version of chrome as you have.  What about Safari that is my biggest issue?

Author

Commented:
I have since checked Google Chrome same version on a native PC and it is showing the same problem.  so there must be something in the preferences making the difference.  Anyone have any ideas?

I need this to show properly in Chrome and Safari.

Thanks,

Randal
Unlock this solution with a free trial preview.
(No credit card required)
Get Preview

Author

Commented:
no one provided a solution so I figured it out myself.
Unlock the solution to this question.
Thanks for using Experts Exchange.

Please provide your email to receive a free trial preview!

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.