Solved

IE6 banner heading alignment

Posted on 2009-07-03
1
413 Views
Last Modified: 2012-06-27
Could you please help me out to resolve this issue?
I am facing this strange issues in IE6. Any Ideas?

Thanks in advance


<div class="banner">

<div class="hd">

<div class="c">Morbi lacus felis, euismod at, pulvinar sit amet</div>

</div>

</div>
 

.banner {

	width:100%;

	background-color:#a6c289;

	margin-bottom: 20px;

}

.banner .hd {

 background:transparent url(banner_l.png) no-repeat 0px 0px;

 margin-right:33px; /* space for right corner */

 height:31px

}

 

.banner .hd .c {

	background:transparent url(banner_r.png) no-repeat right 0px;

	margin-right:-33px; /* pull right corner back over "empty" space (from above margin) */

	height:31px;

	text-align: center;

	padding-top: 8px;

	text-transform: uppercase;

	font-family: Georgia, "Times New Roman", Times, serif;

	font-size: 15px;

	color: #FFFFFF;

	font-weight: bold;

}

Open in new window

ie7-firefox.png
ie6.png
0
Comment
Question by:eChalk
1 Comment
 
LVL 30

Accepted Solution

by:
renazonse earned 100 total points
Comment Utility
Is the banner image a .png using transparency? If so, IE6 doesn't support this and you'll need to use different CSS or an IEPNGFIX to get it to work properly.

see here:
http://www.twinhelix.com/css/iepngfix/
http://renazonse.com/stage/iepng.htm
0

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

Unordered lists (HTML ul tags) are very handy to create menus of all types, shapes and sizes.  All it takes is a little knowledge of CSS and the possibilities are endless. First off, you should know the general format for menus created using the …
Creating a CSS block that only applies to printing By default, all of your CSS applies to every possible view of your page - whether on screen, printed, landscape, touch-screen, or whatever.  You can, however, add CSS that only applies under certai…
In this Micro Tutorial users will learn how to embed custom fonts into websites using @font-face in CSS Select a font: Ensure the EULA allows you to use @font-face: Download the font: Get the browser-compatible files you need: Edit your CSS       - Name …
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…

772 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

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now