|
CSS - 3 Css Site Issues Between Ie6, Ie7 And Firefox
First Issue
In this site the Left Navigation top and bottom spacing is somewhat off. First head over to this page: http://www.pricedigital.com/ejs//ad...weight-loss.htm In firefox the navigation ends up being a tad too low, but the way it looks in ie6 and ie7 is how I want it to look in firefox. Any suggestions? This all takes place in sidebar1 Next Issue How do I center an image using just css? Final Issue In IE6 the floated right photos on a few of these pages do not show up correctly. Here is one for example: http://www.pricedigital.com/ejs//ad...lds-pallant.htm How can I go about fixing this? Similar TutorialsHi CSS gurus, I am a bit stuck with the presentation issues I currently have with my website, http://www.tophatweddings.co.uk. Compare the site layout in IE (6 not 7) and look at it in Firefox. In Firefox you'll notice the borders and backgrounds are not displaying correctly. This is what I want to fix. Has anyone got any suggestions for how I can adjust my CSS to make it display properly in Firefox? Please help sean.dynahosting.net/wordpress ^if you open this in firefox, It is almost exactly how I want, but when you open it in ie, all sorts of troubles arise. Most importantly, the meat of the page (everything except the header and footer) are not centered, and are not 60% of the page, like this: .basic{ font-family: courier new,courier,monotype; font-size: 11px; width: 60%; margin-left: 20%; } says. How much more simply can I put it? Is there anything I can do to fix this, or if not, is there anyway to get browser specific with css? I have a div in my header that contains an image. The height of the image is 82px. For some reason in firefox (and chrome too) if I don't set the div height to 125px it gets cut off. It looks OK in IE6 without the height set, but with it set as needed for firefox it then creates a space in IE. My header file has: Code:
<div id= "logo" ><img src = "images/logo_LWV.gif"></div>
<div id = "topNav">
<div id = "topNavMenu">
<a class = "top" href="index.php">Home</a>
<a class = "top" href="about.php">About Us</a>
<a class = "top" href="join.php">Join</a>
<a class = "top" href="funds.php">Special Funds</a>
<a class = "top" href="contact.php">Contact</a>
</div> <!-- end topNavMenu -->
</div> <!-- end topNav -->
</div> <!-- end topBar -->
<div id = "imagebar"><img src = "images/lwvCorvallis.jpg"></div>
<div id = "greenbar">
<div id = "pagetitle">
<p>Title</p>
</div><!-- end pagetitle -->
</div> <!-- end greebar -->
and the css is: Code: #topbar
{
dispaly:block; width: 800px;
}
#logo
{
float:left;
}
#topNav
{
float:right;
width: 612px;
height: 65px;
background-color:#cc0033;
}
#topNavMenu
{
position:relative; top:40px;
text-align:left;
color: white;
}
#imagebar
{
display:block;
width: 800px; height:125px;
}
#greenbar
{
display:block;
width: 800px; height: 90px;
background: url(images/greenbar.jpg); background-repeat: no-repeat;
z-index: 0;
}
#pagetitle
{
position:relative; left: 200px;top:25px;
width: 600px;
color: white;
z-index: 1;
}
The site is he http://www.lwv.corvallis.or.us/ What's going on? Why do the margin-top values on these layers DO NOTHING in firefox, but act as expected in IE? Which way is actually correct? Also, if I add a float:left to the blue layer, firefox adds a margin-top to the blue and green layers only? This seems very wrong.. How can I get the expected margin-top on each layer? Code: <BODY style="background-color:yellow;"> <div id='blue' style="width:250px; height:250px; display:block; margin-left:1px; margin-top:10px; background-color:blue; position:relative;"> <div id='green' style='width:220px; height:200px; margin-top:10px; background-color:green; display:block; position:relative;'> <!--- prod selector box ---> <div id='gray' style='width:200px; height:150px; overflow:auto; margin-top:10px; margin-left:4px; display:block; background-color:gray; position:relative;'> asdf </div> </div> </div> </BODY> Screw it. http://www.beckin.com http://www.bestdropshipper.net I just recently updated my firefox to the most available version. This firefox version absolutely sux. I don't know why all these browsers have to keep causing trouble for designers. You will notice that my css style for Beckin Designs no longer works. Code: <style type="text/css">
@font-face {
font-family: English;
font-weight: normal;
src: url(fonts/English_.ttf);
}
</style>
If you view this site in other browsers or the firefox version previous to the latest release you will notice it displays fine. However, not in the new firefox. Next, the best dropshipper menu doesn't display correctly either. How can I go about fixing these issues? Do I need to do some time of if statement. Please let me know exactly how to address these issues. Thanks!! Hey y'all. I was hoping someone could help me with some minor margin/padding issues. At one point I knew how to fix this, but I can't for the life of me remember. The site is www (dot) texasarmor (dot) com I like the way the divs are spaced in IE but I don't know how to make IE and Firefox the same. Please help... Also, please if you could, any critiques? Suggestions? Thanks very much. -michael My special font displays correctly in all browsers except the new firefox. It even worked in the older firefox before the new update. I am not sure why this is happening or how to fix it. Here is the code in the html page: Code: <head>
<style type="text/css">
@font-face {
font-family: English;
font-weight: normal;
src: url(fonts/English_.ttf);
}
</style>
</head>
<div class="content">
<h1> Beckin Designs</h1>
Here is the CSS rules in my external CSS sheet: Code: .content h1 {
font-family: "English", sans-serif;
font-size: 52px;
font-style: normal;
/* [disabled]text-transform: uppercase; */
color: #F7F7F7;
text-decoration: none;
width: 930px;
text-align: center;
margin: -10px 0 5px 0;
padding: 0;
}
Thanks! Hello, I am trying to make the table cells in the chart (URL below) at the bottom of the page to be invisible. I have styled the border & background color to #FFFFF (white). When viewed in Firefox, cell borders in gray appear. http://oharenoise.org/2010_news_releases-2.htm Sorry for the "general" title but I don't know what is causing my problems, so it is hard to be specific... I am working on a web application for my summer research project, but I am not very knowledgeable in CSS. For the most part I am able to solve my problems except for the following: Issue 1: Profile Display Issue 1 CSS file The copyright at the bottom. Firefox displays correctly. Explorer displays too much white space above the copyright text. Issue 2 *IMPORTANT*: Profile Display (with missing fields) Issue 2 CSS file The text in the SME Profile does not display correctly when some of the fields are left blank (Issue 1 link shows a full profile). I'm trying to avoid using tables as it would cause some major setbacks in my work. FYI, the pages are dynamically generated so links will not work. Any suggestions? It displays fine in firefox, but not in IE. I haven't done anything personally with websites since php was first coming out, so css is completely new to me and Im using a (now modified) template instead of from scratch. So any help would be great. WARNING: Linked site is not work-safe Site is at 'razornow.comlu.com' css code is: Code:
body {
font-family: tahoma, helvetica, arial, sans-serif;
font-size: 10px;
text-align: center;
background: #000000;
margin: 0px;
padding: 10px;
}
html, #wrapper, h1 {
margin: 0px;
padding: 0px;
}
img { border: 0px; }
#wrapper {
margin: auto;
text-align: left;
width: 710px;
position: relative;
}
h1, h2, h3 {
font-size: 10px;
}
h1 {
line-height: 1;
position: absolute;
top: 0px;
left: 0px;
}
h2 {
margin: 0px 0px 5px 0px;
padding: 0px;
}
h3 {
padding: 4px 0px 0px 0px;
}
.block {
display: block;
}
.clear {
clear: both;
height: 10px;
}
.left {
float: left;
margin: 5px 20px 0px 0px;
}
.right {
float: right;
margin: 0px 0px 0px 20px;
}
.readmore {
text-align: right;
}
/* page structure */
#wrapper {
background: url(images/body_t.gif) top no-repeat;
padding-top: 20px;
}
#body {
background: url(images/body_bg.gif) repeat-y;
padding-bottom: 10px;
}
#body p {
background: white;
}
#nav {
position: absolute;
top: 25px;
left: 253px;
width: 450px;
height:35px;
background: url(images/nav.gif) repeat-x;
}
#nav ul{
padding: 0px;
margin: 0px;
list-style-type: square;
list-style-position: inside;
}
#nav li{
padding: 7px 16px 0px 16px;
margin: 0px;
height:35px;
list-style-type: square;
list-style-position: inside;
float:left;
border-right: 1px solid #FFFFFF;
display:inline;
}
.lastchild{border-right: 0px none #FFFFFF !important;}
#nav a{
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: bold;
text-transform: capitalize;
color: #FFFFFF;
text-decoration: none;
}
#nav a:hover{
color:#fcff85;
}
#current {
float: left;
width: 235px;
margin-left: 10px;
margin-top: -10px;
background: url(images/menu_bg.gif) repeat-y;
border-bottom: 1px solid #05256b;
}
* html #current {
margin-left: 5px;
}
#content {
float: right;
width: 450px;
padding-top: 40px;
margin-right: 8px;
}
* html #content {
margin-right: 4px;
}
#footer {
background: url(images/body_b.gif) no-repeat;
text-align: center;
padding-right: 10px;
padding-left: 480px;
padding-bottom: 30px;
}
#copyright {
position: relative;
top: -8px;
color: #989898;
}
/* current column */
#current .nav {
margin: 21px 6px 5px 5px;
}
#current ul {
border: 1px solid #8497c2;
margin: 0px;
padding: 0px;
}
* html #current ul {
padding: 3px 0px;
padd\ing: 0px;
}
#current li {
list-style: none;
border: 1px solid #4e698f;
background: #01285f url(images/harry.gif) left center no-repeat;
padding: 0px 0px 0px 20px;
margin: 3px;
}
#current li.readmore {
text-align: right;
background-image: none;
}
#current ul a {
color: #beddff;
text-decoration: none;
display: block;
padding: 3px 12px 3px 0px;
}
* html #current ul a {
width: 100%;
w\idth: auto;
}
#current ul a:hover {
color: white;
}
#current .readmore {
padding: 3px 4px 4px 20px;
}
* html #current .readmore {
padding: 0px 4px 1px 20px;
padd\ing: 3px 4px 4px 20px;
}
#current .readmore a {
text-decoration: underline;
display: inline;
}
#currenttitle {
position: absolute;
left: 15px;
top: 409px;
}
* html #currenttitle {
top: 411px;
}
/* page content */
#content h2 {
line-height: 1;
margin: 0px;
padding: 20px 0px 0px 0px;
}
#content h3 {
margin: 10px 0px;
padding: 0px;
text-transform: capitalize;
}
#content p {
margin: 10px 0px;
padding: 0px;
}
#content .contentbox {
border: 1px solid #e1e1e1;
border-top: none;
padding: 5px 20px 10px 20px;
}
* html #content .contentbox {
padding-bottom: 11px;
}
#content, #content a {
color: #868686;
}
#content a:hover {
color: #000;
}
The problem I have has arisen whilst trying to create a horizontal and a vertical navigation menu using <li> tags. It is best illustrated by the following example: Code: <div style="width:100%;height:50px;"> <ul> <li style="border:1px solid black;">Hello</li> <li>World</li> </ul> </div> <br /> <div style="width:100px;height:100%;"> <ul> <li style="border:1px solid black;">Hello</li> <li>World</li> </ul> </div> and the CSS Code:
div {
border:0;
background-color:#888888;
}
ul {
margin:0;padding:0;
}
ul li {
float:left;
list-style:none;
background-color:#CCCCCC;
height:50px;
width:100px;
}
The <div> tags are set to 50px height and 100px width respectively. When an <li> element is placed within the div with the same height or width they display the way I intended. However once a 1px border is applied to the <li>'s then in IE the border is counted as part of the width or height. In Firefox the border will add 2px to the starting height and width giving the effect of width:102px or height:52px;. This is massively frustrating as I need each <li> to have the 1px border. It looks different in each browser (I have not tested it in netscape nor opera, but I suspect they will display the same as Firefox.) Can anyone provide a fix to get get round this please? Thank you in advance. I've having an issue with Firefox and my navbar. It's image based I can't find a way to exclude it from the hover state of a:hover { border-bottom:1px dashed #666;} When you hover over the links on the navbar, it shifts the page a bit and then back to normal when you leave the hover state. http://www.graphics-tech.com/concept There is the link for example. Thanks The objective: Produce page content which behaves as if it were 'tabbed' as seen on many websites and programmes. I have done this many times before, but only with absolute positioning from the document base level. This time, the div containing the information to be tabbed has to appear relative (for re-sizability) and contain the tab divs within it. I am using a short javascript to change the z-index of the divs in order to produce the tab effect. The problem: The whole thing works fine, except for: - If I leave the css height off the divs, IE chops the bottom off, and does not allow a scroll. - If I put a height and auto (or scroll) overflow on the divs they display correctly in IE, but disappear in firefox - Until a table contained within one of the divs becomes larger than the stated height. At which point that div (not any of the others) disappears from IE as well. The question: Is this a known bug? If so, what is the work-around? Have I done something dumb? If so, what? The source: source files are available for download (they are quite large, and I don't want to trim them in case something in the trim is the problem. Plus they need to be large to demonstrate the length issue correctly). Text within these examples is copyrighted by various people and is used without permission, for illustrative purposes only. the xhtml page - click through the tabs to see the effect. Add extra rows to the table in the 'dates & prices' tab to see the disappearing problem. the javascript file - the function is at the bottom, 'layer_z_lift'. the css stylesheet - the styles for the tabs are in the middle, commented as tour details tabs. any questions, post and I shall answer. Jz. I dont know why it is doing this in firefox here is my css coding then is my html file coding Code:
#header {
width: 800px;
height: 164px;
margin: 0px;
padding: 0px;
background: red url(images/header.jpg);
}
#menubox {
width: 215px;
height: 194px;
margin: 0 0 0;
padding: 0px;
background: blue url(images/menu.jpg);
}
#menu-in {
width: 73px;
height: 158px;
padding: 0px;
margin-left: 41px;
margin-top: 16px;
background: red;
}
#banner {
width: 585px;
height:194px;
margin-left: 215px;
margin-top: -194px;
background: green url(images/banner.jpg);
}
#sidepic {
width: 165px;
height: 692px;
background: green;
}
#sidepic-in {
width: 127px;
height: 634px;
margin-left: 19px;
margin-top: 29px;
background: brown url(images/sidepic.jpg);
}
#main {
width: 413px;
height: 692px;
margin-left: 165px;
margin-top: -692px;
background: purple;
}
#main-in (
width: 378px;
height: 628px;
margin-left: 18px;
margin-top: 32px;
background: red;
}
#pictures {
width: 222px;
height:505px;
margin-left: 578px;
margin-top: -692px;
background: blue;
}
#pictures-in (
width: 171px;
height:424px;
margin-left: 22px;
margin-top: 60px;
background: red;
}
#links {
width: 222px;
height: 187px;
margin-left: 578px;
background: red;
}
#footer {
width: 800px;
height: 50px;
background: yellow;
}
{
Code: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>New Page 1</title> <link rel="stylesheet" type="text/css" href="styles.css"> </head> <body> <div id="header"> </div> <div id="menubox"> <div id="menu-in"> </div> </div> <div id="banner"> </div> <div id="sidepic"> <div id="sidepic-in"> </div> </div> <div id="main"> <div id="main-in"> </div> </div> <div id="pictures"> <div id="pictures-in"> </div> </div> <div id="links"> </div> <div id="footer"> </div> </body> </html> Hello. Im new to the forums and Im hoping someone would be able to help me and I hope Im posting in the correct forum. I recently redesigned my site with Adobe Dreamweaver utilizing CSS. Both the HTML and CSS validates. I have tried to search for my problem but havent found it already addressed. I had CSS before but my old software didnt support it as well. Im still learning a lot about the CSS so my problem might be minor, but I just dont have enough knowledge yet to know or to even begin to fix it. The site appeared fine in IE. I didnt think (stupid I know) to test it in firefox. Recently I did and noticed it did not show the top header, the right menu or did it allow you to scroll down the page. Ive read elsewhere that part of my problem may be due to having this at the top of my page Code: <%@LANGUAGE="JAVASCRIPT" CODEPAGE="65001"%> but if I remove that, then the site looks the same in IE as it does in Firefox. Here is a link to the index page of my site. I currently have the above line of code in the page so you can see what it is suppose to look like. Please view this in both browsers so you can see what its suppose to look like (IE) and how firefox is displaying it: http://www.herbal-connection.com/index.htm Here is a copy of my css: Code: table.sale {
border-collapse: separate;
background-color: white;
text-align: center;
vertical-align: middle;
width: 30em;
margin-left:auto;
margin-right:auto;
}
img
{ border-style: none;
}
body {
text-align: center;
color: #FFFFFF;
background-color: #000000;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 95%;
}
.twoColFixRtHdr #container {
width: 1043px;
margin: 0 auto;
border: thin solid #000000;
text-align: justify;
background-color: #FFFFFF;
font-family: Georgia, "Times New Roman", Times, serif;
color: #000000;
}
.twoColFixRtHdr #header {
background-image: url(herbalconnectionlogo1.gif);
HEIGHT: 82px;
background-repeat: no-repeat;
overflow: visible;
position: fixed;
}
.twoColFixRtHdr #header h1 {
FONT-FAMILY: Georgia, "Times New Roman", Times, serif;
COLOR: #004278;
font-size: 30px;
background-color: transparent;
margin-top: 0em;
margin-right: 0em;
margin-bottom: 0em;
margin-left: 5px;
}
.twoColFixRtHdr #header H2 {
FONT-FAMILY: Georgia, "Times New Roman", Times, serif;
COLOR: #006397;
background:transparent;
vertical-align: top;
font-size: 20px;
margin-top: 0em;
margin-right: 0em;
margin-bottom: 0em;
margin-left: 5px;
}
.twoColFixRtHdr #mainContent {
background-color: #FFFFFF;
padding-right: 20px;
padding-left: 20px;
position: fixed;
width: 860px;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: medium;
color: #000000;
}
.twoColFixRtHdr #mainContent h1 {
PADDING: 0em;
FONT-FAMILY: Georgia, "Times New Roman", Times, serif;
FONT-SIZE: x-large;
text-align: center;
COLOR: #004278;
MARGIN: 1em;
background-color: #FFFFFF;
}
.twoColFixRtHdr #mainContent h2 {
PADDING: 0em;
FONT-FAMILY: Georgia, "Times New Roman", Times, serif;
FONT-SIZE: large;
text-align: center;
COLOR: #004278;
MARGIN: .1em;
background-color: #FFFFFF;
}
.twoColFixRtHdr #mainContent h3{
FONT-FAMILY: Georgia, "Times New Roman", Times, serif;
COLOR: #004278;
font-size:medium;
text-align:center;
background:transparent;
margin-top: .5px;
}
.twoColFixRtHdr #mainContent h4{
FONT-FAMILY: Georgia, "Times New Roman", Times, serif;
color:#B22222;
font-size:medium;
text-align:center;
background:transparent;
margin-top: .5px;
}
.twoColFixRtHdr #mainContent a:link {
color: #B22222;
font-weight:bold;
background-color: #FFFFFF;
}
.twoColFixRtHdr #mainContent a:visited {
color: #B22222;
background-color: #FFFFFF;
}
.twoColFixRtHdr #mainContent a:hover {
color: white;
background: black;
}
.twoColFixRtHdr #mainContent a:active {
color:#B22222;
background-color: #FFFFFF;
}
.twoColFixRtHdr #sidebar1 {
float: right;
width: 140px;
background-color: #D7DEE4;
text-align: center;
position: fixed;
background-position: top;
font-family: Georgia, "Times New Roman", Times, serif;
color: #000000;
}
.fltrt {
float: right;
margin-left: 8px;
width: 0px;
}
.fltlft {
float: left;
margin-right: 8px;
width: 0px;
}
.clearfloat {
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
}
.center {
text-align: center;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: medium;
color: #000000;
background-color: #FFFFFF;
}
.hrule {
border-bottom-width: 0.04em;
border-bottom-style: solid;
border-bottom-color: #000000;
padding-top: 0em;
padding-bottom: 1em;
}
I appreciate all input anyone can give, just please dont get to high techy with me as Im still learning. This is my business site and now I see why my sales have declined since probably a lot of people cant see the site properly. Please let me know if you need any other details. Thanks, Pamela I'm trying to control the line-height of a list element. I've tried percentage, numbers, and points, without much luck. I'm trying to decrease the vertical spacing between each list element and can successfully do so in Firefox with the line-height property, but when it's viewed in IE, the bottom half of the characters get cut off. Is there a better method to do this in IE? Thanks! I apologize if this is supposed to be in the HTML forum. Since html code can be viewed from the source I thought I will post the css code to cross check since I couldn't figure out what is causing the problem. So thought I would post it in CSS forum. I have the following site that displays fine in Firefox but is all a mess in IE. http://www.geocities.com/dhaagey08/DhaageyTab2.html Following is the CSS code I am using. ====================================== * { margin: 0; padding: 0; } html { background: #fff url("images/html1.png") repeat-x left top; } body { font-family: arial, sans-serif; font-size: 12px; color: #888888; background: url("images/body.png") repeat-y left top; width: 1000px; margin: 0 auto 30px auto; position: relative; } a img { border: 1px solid #ccc; } a { color: #f48a88; text-decoration: none; } a:hover { visibility: visible; /* IE bug fix */ } a:hover img { border: 1px solid #729AD7; } h1 { font-size: 14px; } h2 { font-size: 12px; } .page { background: url("images/page3.jpg") no-repeat left top; padding: 15px 125px 0px 115px; width: 760px; } .header{ position: relative; width: 760px; height: 170px; left: 5px; top: 0; background: url("images/header1a.jpg") no-repeat left top; } /************* menu1 ******************/ .bar4285801 { width: 345px; height: 35px; position: relative; } .bar4285801 table.tabbar { position: absolute; width: auto; height: auto; top: 0px; left: 45px; } .bar4285801 div { height: 35px; width: 115px; } .bar4285801 div.button { background: url(menu47831178.jpg); } /****************** menu2 ***********************/ .bar4285846 { width: 345px; height: 35px; position: relative; } .bar4285846 table.tabbar { position: relative; width: auto; height: auto; top: -35px; left: 390px; } .bar4285846 div { height: 35px; width: 115px; } .bar4285846 div.button { background: url(menu30455262.jpg); } .main { width: 706px; margin: 0 auto; } .box1 { border: 1px solid #ccc; clear: both; padding: 0 5px 25px 2px; width: 690px; height:350px; position: relative; } .lady { float: left; width:220px; height:350px; background: url("images/lady2s.jpg"); } #right { width: 457px; float: right; padding-bottom: 130px; } .dhaagey { font-family: monotype corsiva; font-size: 30px; color: #89201d; } .contact{ font-family: monotype corsiva; font-size: 18px; color: #89201d; float: right; margin-top: 55px; } .photos { margin-top: 5px; padding-bottom: 8px; } .photos a { width: 106px; height: 140px; float: left; background: #C2D3EE; text-align: center; color: #A2A3A6; text-decoration: none; font-size: 11px; font-weight: bold; margin-right: 14px; } .photos>a { min-height: 148px; height: auto; } .photos a.last, .greybox-background .right a.last { margin-right: 0; } .photos a:hover { color: #f48a88; } .photos a span { display: block; padding-top: 2px; } .photos a>span { padding-top: 5px; } .greybox { border: 1px solid #ccc; margin-bottom: 39px; padding: 5px 0; } .greybox-background { background: url("images/gbback.jpg") repeat-y left top; width: 100%; line-height: 170%; } .greybox-background .left, .greybox-background .right { width: 321px; float: left; padding: 0 10px; } .greybox-background .right { float: left; padding: 0 19px 0 20px; } .greybox-background .right a { display: block; float: left; margin-right: 11px; margin-top: 8px; } .greybox2 { border: 1px solid #ccc; margin-bottom: 15px; padding: 9px 7px; width: 688px; } .greybox2 .preview { float: left; margin-right: 40px; margin-right: 44px; } .greybox2 .preview img { padding: 5px; } .greybox2 .right { float: left; width: 350px; } .greybox2 .right a { float: left; margin: 0 14px 7px 0; } .footer1 { text-align: center; padding: 0 27px 3px 27px; } .footer1 a { color: #872323; text-decoration: none; } .footer1 a:hover { color: #d87126; text-decoration: none; } .footer2 { font-size: 0px; line-height: 0px; height: 15px; background: url("images/footer.png") no-repeat left top; margin-left: 110px; } .cleaner { font-size: 0px; line-height: 0px; height: 0px; clear: both; } ============================================ Any help is greatly appareciated. |
|||||||