|
CSS - Background Image Doesn't Display???
I am wanting to display an image as a background. However that isn't working for me. So can someone please help me solve this problem? Thanks in advance.
This is the css code that I am working with: Code:
body {
background-image: url(cattle_bg.jpg);
background-attachment: fixed;
background-repeat: no-repeat;
margin: 0px;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
This is the link for that css code which is the htm file: Code: <link href="/images/styles.css" rel="stylesheet" type="text/css" /> Similar TutorialsOkay the backgroundimage "content-header" does not display in firefox for the <div id="contentWrapper"> tag. In internet explorer it displays. Not sure what the hell is going on with it. I hate css http://www.mgan.net/work/10-06-04/layout1.html There is the link, I have my styles in the header section of the html file. I'm trying to create a little background image for each image on this page. A kind of crappy looking polaroid type background image. It works fine in Firefox, but not in IE. Any ideas? http://www.rhizaowns.com/holly/index.php Hi! I have a css file (validated) which contains: Code: TD.p1{ text-align: left; background-image: url('http://local/adres/img/szablon/1/g_1.gif'); }
this works properly with Opera 7.54, Mozilla, but it doesn't work with MSIE! Only in MSIE I can't see the background image. Does anybody knows what may be wrong? MSIE version: 6.0.2600.0000 I'm creating an email template for all mail that I'll send to my users. I'm trying to make it work for as many mail clients as possible, so I'm only using inline css. Even with that, it appears that gmail doesn't support the background-image property. I have a table defined as Code:
<table style="background:#666666; background-image:url(http://{$_SERVER['SERVER_NAME']}/images/bg_grad.gif); background-repeat:repeat-x; width:100%; height:100%; margin:0px; " cellpadding="0" cellspacing="0">
...
This works fine for yahoo mail. With gmail, it will render "background", but as soon as I try and add an image, it ignores all of the styling. Has anybody run into this problem? Any suggestions on a solution would be greatly appreciated. I hardly ever use css for thimgs like backgrounds, but I have a freelance client that has alot of interesting ideas about how a good website should look so I'm trying to make him happy. When I have: body { background: url('resources/assets/background.jpg') no-repeat bottom left; } in the extranal css it doesn't work. If I put it into the page it works fine. None of the online css resources I've looked at mention why this should be. I've even tried using the complete http://www.server.com/blah/blah/ address and I get the same results. Does this just not work from an external css, or am I missing something? Thanks y'all. Hi Guys, I am new to CSS, i have an image (attached) and it will not display as a background image. The other images I have will no problem. It is def something about the image because i have renamed it e.t.c Could someone help? Image is attached! Can you get it to display? Charlie Hello, I'm having a problem that I can't seem to fix - and I've been at it for two days now, I think it's time for an outsider's point of view. First of all, I've googled and researched to no end about this - and others have had the same problem as me, but for some reason nothing that's been suggested has fixed it. With any luck it's just some stupid typo I'm missing or something . I'm using Dreamweaver CS3 to make a site, but I'm not using the WYSIWYG editor, I'm just using that to see what it looks like as a quick-view during development, and uploading it via FTP to the server to see a more accurate representation of it (basically, the code isn't written by DW). Here's the problem. In DW, the "background-image" tag in the CSS file is displaying all of the images perfectly, but when I upload the site - the images simply don't appear, but if you resize your browser window you can tell by the way the scrollbars are behaving that it is holding places for the images. I've tried everything I can think of, including using the "overflow" tag, trying different ways of writing the file paths (absolute vs. relative), and I've looked through every line of the code over and over again. CSS file: Code: @charset "utf-8";
/* CSS Document */
body
{
margin: 0px;
padding: 0px;
font-family: Georgia, "Times New Roman", Times, serif;
font-color: #000000;
background-color: #f5f0c4;
}
.pageholder
{
position: relative;
width: 1000px;
height: 750px;
margin-left: auto;
margin-right: auto;
}
.outerbg
{
position: absolute;
left: 50px;
width: 904px;
height: 654px;
margin: auto;
background-image: url(../images/bg/outer.png);
background: no-repeat;
}
.innerbg
{
position: absolute;
top: 100px;
left: 150px;
width: 702px;
height: 502px;
margin: auto;
background-image: url(../images/bg/inner.png);
background: no-repeat;
}
.footer
{
position: absolute;
top: 675px;
left: 154px;
width: 692px;
height: 32px;
margin: auto;
background-image: url(../images/bg/bar.png);
background: no-repeat;
}
main.html file: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Main Page</title> <link href="../css/style.css" rel="stylesheet" type="text/css" /> </head> <body> <div class="pageholder"> <div class="outerbg"></div> <div class="innerbg"></div> <div class="footer"></div> </div> </body> </html> Here's a link to the site it's being hosted on (and not showing images for some reason). And this is an image of what it looks like in DW (also has the file structure on the right of the image):URL If anyone can point out where I'm going wrong, thank you - it's appreciated! Quick problem: Page he h**p://topofferspage*com (I don't want Google indexing the url here.) Background image is displaying in FF but not IE6. I don't think I've had this problem before. Can anyone tell what I'm missing here? HTML Code: <div id="block-user-1" class="block block-user"> <h2>Navigation</h2> <div class="content"> <ul class="menu"> <li class="leaf"><a href="/" title="Top Offers Home Page" class="active">Home</a></li> <li class="leaf"><a href="/about" title="About the Top Offers Page website">About us</a></li> <li class="leaf"><a href="/privacy" title="Privacy Policy">Privacy Policy</a></li> <li class="leaf"><a href="http://topofferspage.com/contact" title="Contact page">Contact Us</a></li> </ul> </div> </div> CSS Code:
/* Masthead Navigation */
#block-user-1 h2{
text-indent: -9999em;
}
#block-user-1 ul{
float: right;
position: relative;
}
#block-user-1 ul li{
float:right;
position:relative;
right:80px;
top:75px;
background: none;
}
#block-user-1 ul li a{
color: #FFF;
text-transform: lowercase;
}
/*--- /Masthead Navigation ---*/
You win many internets of love for your help. Hello. Can someone please help me understand why this page looks fine in IE7 and Firefox, but not in IE6: http://www.shootingblanks.net/TEMP/Nevermind/bio.php You can see that the background image is completely cut off on the left in IE6, and I'm not understanding why. Here's the CSS code for that div: Code: #bioContent {
background: url(../images/bkgnds/bio.jpg) no-repeat top left;
width: 140px;
min-height: 550px;
float: left;
margin: 0;
padding: 0;
}
Also, there's one other page on the same site that's also behaving oddly only in IE6. The picture is not on the bottom-right like it should be, and it's getting cut off: http://www.shootingblanks.net/TEMP/Nevermind/news.php Here is the code for that div, if anyone has suggestions on that one too. Thanks!!!: Code: #newsContent {
background: url(../images/bkgnds/news.jpg) no-repeat bottom right;
min-height: 400px;
text-align: left;
}
Hi all, thanks on the last post, hope you can help with this too. I'm trying to get an image to display in a box, and repeat all along the box (only a 1 pixel image). But for some reason its not being picked up. my code is: Code:
<body>
<div id="wrap">
<div id="innerwrap">
<div id="holding">
holding
</div>
</div>
</div>
</body>
and the css is this: Code:
#wrap{width:60em;height:43em;background:silver;margin:0 auto;text-align:left; padding-top:.1em;}
#innerwrap{ background-color:gray;margin:.5em;height:42em;}
#holding {background:#3F8BCA url(/img/topgradient.jpg) repeat-x scroll left top;}
I've tried to change the brackets to forward brackets, tried to and ", but nothing works, im sure the spelling etc is correct... any help would be great Kind regards MG Is there a fix? I have a gradient background image that goes from dark to light. At the bottom of the table if the body of text grows too large the table will stretch past the length of the background gradient image exposing the bgcolor for the page (not acceptable). If I change the bgcolor of the table the color is applied over the background image. Isn't there a way to fix this with CSS? Thanks for any help!!! Hi everyone, I'm experiencing an unusual problem that I could use some help with. I've a layout that uses three background images (in separate divs) - a top bg, a bottom bg, and an overall bg. The bottom and overall background images are causing a problem. The top bg and bottom bg are supposed to line up. And they do! My layout looked fine on my computer (PC using Firefox 3.5.7 and IE8). I uploaded it to my personal website - and it looked fine there also. I validated the code successfully. The problem happened when I uploaded it to my client's web server. The top bg displayed ok. However, the overall and bottom background images did not display correctly. They seemed "squeezed". The overall should be center and extend to both ends of the browser window (the image is large enough). I can't seem to identify why it would do this. I even did a test by removing all of the code except for the div containing the background image. I added another div and placed the image directly into it (so that I could compare the size). Here's the css: Code: html, body {
margin: 0;
padding: 0;
background-color: #CCC;
}
#botDrop {
/* margin: auto;
*/ background: url('../images/bgDropBot.jpg') no-repeat left top;
/* width: 971px;
height: 50px;
*/ background-color: #CCC;
}
Again, looked fine on my computer, looked fine on my web server - displayed incorrectly on the client's server. On the client's server it again displayed (horizontally) smaller than it's actual size. My background image was initially about 1200 pixels wide. I reduced it, and that seemed to make it a little better, but didn't quite fix the issue. I suspect there's some sort of calculation going on depending on the screen size. However, I don't get why it doesn't do that for me when I view it locally or on my personal web server. Here's a screenshot showing the problem: http://www.stephencamper.com/screenshot/screenshot.jpg I just want the background image to display at it's actual size. Any help's appreciated. Thanks. -Stephen Hi All, Here's my issue... I have decided to try an all css-based layout which will incorporate: 1. a background image (770px wide) that repeats on the y axis in the BODY tag 2. a background image that will not repeat in a DIV tag that is slightly less wide (750px) than the BODY tag's background image The background image in the BODY will repeat on the y axis and provide a backdrop and edges that extend beyond and below the background image contained in the DIV tag which will also contain the main content/text for the site. [ Note: The background-image in the DIV tag is 631px in height. ] The problem is as follows: Since I do not have enough text to extend the content DIV to the height of the background image and/or beyond, the background image is not being fully displayed; the top and bottom of the background image is being cut off and the image as a whole is being pushed upward at the same time. To see the problem: http://publictrust.ca/css/default.htm The css is as follows: body { font-family: Verdana, Arial, Helvetica, sans-serif; color: #260D0D; font-size: 0.8em; background-color: #260D0D; margin: 0px; padding: 0px; background-image: url(../images/body-bg.jpg); background-repeat: repeat-y; background-position: center center; } #divHeader { margin: 0px; width: 750px; color: #260D0D; } #divMain { background-color: #EDCCA1; background-image: url(../images/container-bg.jpg); background-repeat: no-repeat; background-position: center center; width: 750px; color: #260D0D; } #divFooter { text-align: center; font-size: 0.7em; margin: 25px 0 0 0; } #divHeader, #divMain, #divFooter { width:750px; margin-top: 0px; margin-right: auto; margin-bottom: 0px; margin-left: auto; color: #260D0D; } #leftMenu { float:left; margin:130px 0 0 5px; padding: 0px; width:150px; } #divMainContent { float:right; width:500px; margin: 150px 5px 50px 5px; border-top: 1px solid #260D0D; } The css file can be downloaded at: http://publictrust.ca/css/css/template_css2.css Caveat: the solution must work in IE and mozilla/netscape AND when I add more text to the main content area, the DIV must stretch downwards to accommodate the extra text *without* changing the height of the divHeader & divFooter. Thanks in Advance, mne An important part of my design is the background image. I have tried many different things but cannot seem to solve this. I have two options: Option 1: One placing the image in a tag within the body. Results where pretty good except in IE 6 the content is displayed under the image. You can see the effect of option 1 on this portion of the site: http://woodysfireworks.nl/w/index.html example Code:
/*option1 background image*/
img.bg {
background-color:#000;
/* Set rules to fill background */
min-height: 100%;
min-width: 1024px;
/* Set up proportionate scaling */
width: 100%;
height: auto;
overflow:hidden;
/* Set up positioning */
position: fixed;
z-index:0;
top: 0;
left: 0;
}
@media screen and (max-width: 1024px){
img.bg {
left: 50%;
margin-left: -512px; }
}
Option2: I placed the image in the style sheet and then included a class and id in the tag. Here the images get blown up in all version of IE. example Code:
/*option 2 background image*/
#start{ background:url(images2/426.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.myBackground.jpg', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale')";}
I would really appreciate some insight. I am pulling my hair out. Thanks Hi everyone...new here and I hope you can help! Thanks is advance! I want to repeat an image (bkgd.jpg) in my background and it doesn't seem to be working. Here is the site: romanceplaybook I can't post the entire URL because I'm a new registrant. But just put dot com at the end. Not that the page background is white. It should be repeating the image bkgd.jpg Here is the CSS: body { background: #ffffff url(images/bkgd.jpg) top repeat-y; color: #333333; font-size: 11px; font-family: Verdana, Helvetica, Sans-Serif; margin: 0px auto 0px; padding: 0px; } #wrap { background: #ffffff url(images/bg.jpg) top center repeat-y; color: #333333; font-size: 11px; font-family: Verdana, Helvetica, Sans-Serif; margin: 0px 300px 0px; padding: 0px; } /************************************************ * Hyperlinks * ************************************************/ a, a:visited{ color: #507AA5; text-decoration: none; } a:hover{ text-decoration: underline; } /************************************************ * Header * ************************************************/ #header { background: #FFFFFF; width: 1000px; margin: 0px auto 0px; padding: 0px 0px 0px 0px; text-align: center; text-transform: uppercase; } #header a { font-family: Times New Roman, Helvetica, Sans-Serif; font-size: 48px; color: #333333; text-decoration: none; padding: 0px 10px 0px 10px; margin: 0px; text-transform: uppercase; } #header a:hover{ color: #333333; } /************************************************ * Navbar * ************************************************/ /************************************************ * Left Sidebar * ************************************************/ #l_sidebar { float: left; width: 160px; margin: 0px 20px 0px 0px; padding: 20px 0px 20px 0px; } #l_sidebar ul { list-style: none; margin: 0px; padding: 0px 0px 20px 0px; } #l_sidebar li { list-style: none; margin: 0px; padding: 0px; } #l_sidebar ul li { margin: 0px; padding: 5px 0px 0px 0px; } #l_sidebar ul li a { color: #507AA5; text-decoration: none; } #l_sidebar ul li a:hover { color: #507AA5; text-decoration: underline; } /************************************************ * Right Sidebar * ************************************************/ #r_sidebar { float: right; width: 160px; margin: 0px 0px 0px 0px; padding: 20px 0px 0px 0px; } #r_sidebar p{ padding: 2px 0px 16px 0px; margin: 0px; line-height: 20px; } #r_sidebar ul { list-style: none; margin: 0px; padding: 0px 0px 20px 0px; } #r_sidebar ul li { margin: 0px; padding: 5px 0px 0px 0px; } #r_sidebar ul li a { color: #507AA5; text-decoration: none; } #r_sidebar ul li a:hover { color: #507AA5; text-decoration: underline; } /************************************************ * Content * ************************************************/ #content { width: 950px; margin: 0px auto 0px; padding: 0px; } #content p{ padding: 0px 0px 15px 0px; margin: 0px; line-height: 20px; } #content p img{ float: left; border: none; margin-right: 15px; margin-bottom: 10px; } #content h1 { color: #333333; font-size: 22px; font-family: Times New Roman, Verdana, Arial, Sans-Serif; font-weight: normal; padding: 0px 0px 0px 0px; margin: 0px; } #content h1 a { color: #333333; text-decoration: none; } #content h1 a:hover { color: #658DB5; text-decoration: none; } #content h2 { color: #333333; font-size: 14px; font-family: Times New Roman, Verdana, Arial, Sans-Serif; font-weight: bold; padding: 5px 0px 5px 0px; margin: 0px; border-top: 1px dotted #C0C0C0; border-bottom: 1px dotted #C0C0C0; } #content p ol{ margin: 0px; padding: 0px 0px 0px 20px; } #content p ul{ margin: 0px; padding: 0px 0px 0px 20px; } blockquote{ margin: 0px 0px 0px 25px; padding: 0px 25px 0px 10px; font-style: italic; color: #666666; border-left: 3px solid #B3C8DB; } #content blockquote p{ margin: 0px 0px 20px 0px; padding: 0px; } #contentmiddle { float: left; width: 550px; margin: 0px 0px 0px 0px; padding: 20px 5px 10px 20px; text-align: left; } #contentmiddle p img{ float: left; border: none; margin-right: 15px; margin-bottom: 10px; } .contentdate { background: #FFFFFF url(images/date.gif); float: left; width: 45px; height: 50px; margin: 0px; padding: 0px; } .contentdate h3 { color: #FFFFFF; font-size: 10px; font-weight: normal; padding: 1px 0px 0px 10px; margin: 0px; text-transform: uppercase; } .contentdate h4 { font-family: Times New Roman, Helvetica, Sans-Serif; color: #999999; font-size: 21px; font-weight: bold; padding: 5px 4px 0px 0px; margin: 0px; text-align: center; } .contenttitle { float: left; width: 480px; margin: 0px; padding: 0px 0px 0px 10px; } #contentmiddle ul { list-style: none; margin: 0px; padding: 0px 0px 20px 0px; } #contentmiddle ul li { margin: 0px; padding: 5px 0px 0px 0px; } #contentmiddle ul li a { color: #507AA5; text-decoration: none; } #contentmiddle ul li a:hover { color: #507AA5; text-decoration: underline; } #content img.wp-smiley { float: none; border: none; padding: 0px; margin: 0px; } #content img.wp-wink { float: none; border: none; padding: 0px; margin: 0px; } .postspace { background: #EFEFEF url(images/spacer.gif); width: 440px; height: 32px; margin: 0px; padding: 0px; } /************************************************ * Footer * ************************************************/ #footer { background: #FFFFFF; width: 952px; margin: 0px auto 0px; padding: 10px 0px 10px 0px; text-align: center; border-top: 1px solid #C0C0C0; } /************************************************ * Search Form * ************************************************/ #searchdiv { margin: 0px; padding 0px; } #searchform { margin: 0px; padding: 0px; overflow: hidden; } #s { width: 190px; background: #EFEFEF url(images/search.gif); color: #333333; font-size: 11px; font-family: Verdana, Helvetica, Sans-Serif; padding: 3px; margin: 8px 0px 0px 0px; border: 1px solid #C0C0C0; } /************************************************ * Comments * ************************************************/ #commentblock { width: 395px; background: #EFEFEF; color: #333333; float: left; padding: 10px 20px 0px 20px; margin: 10px 0px 10px 0px; border: 1px solid #C0C0C0; } ol#commentlist { padding: 5px 0px 5px 0px; margin: 0px; list-style-type: none; } .commentdate { font-size: 12px; padding-left: 0px; } #commentlist li p{ margin-bottom: 8px; line-height: 20px; padding: 0px; } .commentname { color: #333333; margin: 0px; padding: 5px 5px 5px 0px; } .commentinfo{ clear: both; } .commenttext { clear: both; margin: 5px 0px 20px 0px; padding: 20px 10px 5px 10px; width: 365px; background: #FFFFFF url(images/comment.gif) no-repeat top; } .commenttext-admin { clear: both; margin: 5px 0px 20px 0px; padding: 20px 10px 5px 10px; width: 365px; background: #FFFFFF url(images/comment.gif) no-repeat top; } #commentsformheader{ padding-left: 0px; } #commentsform{ text-align: left; margin: 0px; padding: 0px; } #commentsform form{ text-align: left; margin: 0px; } #commentsform p{ margin: 0px; } #commentsform form textarea{ width: 99%; } p.comments_link img{ margin: 0px; padding: 0px; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; } I have the following page, when the user clicks Reply a form should appear within the box. Works greats in Firefox, but in Internet Explorer the form appears within the next box. Anyone know a work around to get this work in IE? I'm pretty new to CSS and JavaScript, so it may be that I am missing something obvious here. Thank you very much for your help, a google search turned up nothing, nor did hours of trial and error. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Title Goes Here</title>
<style type="text/css" media="screen">
.pbox {
padding : 10px;
background-color : white;
}
.pboxtitle {
position : relative;
border-bottom : 2px solid black;
background-color:gray;
padding : 2px 5px;
}
.wbox {
padding : 1px;
background-color : white;
font-size: 12px;
margin-bottom: 4px;
}
.wboxtitle {
position : relative;
border-bottom : 2px solid black;
background-color: #CDCDCD;
padding : 2px 0px;
font-size: 12px;
height: 13px;
}
.subbox {
padding : 1px;
background-color : white;
font-size: 12px;
margin-bottom: 4px;
}
.subboxtitle {
position : relative;
border-bottom : 2px solid black;
background-color: #CDCDCD;
padding : 2px 0px;
font-size: 12px;
height: 13px;
margin-left: 10px;
}
</style>
<SCRIPT LANGUAGE="JavaScript">
function show(id){
var obj = document.getElementById(id);
obj.style.display = 'block';
}
</SCRIPT>
</head>
<body>
<div class='pboxtitle'>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
<div class='pbox'>
<div class='wboxtitle' >Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div><div class='wbox' style="width: 100%">tester <a onclick='show("id1"); return false;' href=''>Reply</a></span>
<span style='display:none;' id='id1'><form action='u.php' method='put' >
<textarea name='comment' cols='35' rows='3'></textarea>
<input name='commentid' type='hidden' value='1'>
<input name='submit' type='button' value='Add Comment'></form></span>
</div><div class='wboxtitle' style='float: none;'>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div><div class='wbox'>tester<a onclick='show("id2"); return false;' href=''>Reply</a>
<span style='display:none;' id='id2'><form action='u.php' method='put' >
<textarea name='comment' cols='35' rows='3'></textarea>
<input name='commentid' type='hidden' value='2'>
<input name='submit' type='button' value='Add Comment'></form></span>
</div><div class='wboxtitle'>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div><div class='wbox'>tester<a onclick='show("id3"); return false;' href=''>Reply</a>
<span style='display:none;' id='id3'><form action='u.php' method='put' >
<textarea name='comment' cols='35' rows='3'></textarea>
<input name='commentid' type='hidden' value='3'>
<input name='submit' type='button' value='Add Comment'></form></span>
</div><div class='wboxtitle'>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div><div class='wbox'>tester<a onclick='show("id4"); return false;' href=''>Reply</a>
<div style='display:none;' id='id4'><form action='u.php' method='put' >
<textarea name='comment' cols='35' rows='3'></textarea>
<input name='commentid' type='hidden' value='4'>
<input name='submit' type='button' value='Add Comment'></form></div>
</div>
<div class='wboxtitle'>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div><div class='wbox'>tester<a onclick='show("id5"); return false;' href=''>Reply</a>
<span style='display:none;' id='id5'><form action='u.php' method='put' >
<textarea name='comment' cols='35' rows='3'></textarea>
<input name='commentid' type='hidden' value='5'>
<input name='submit' type='button' value='Add Comment'></form></span>
</div>
<div class='wboxtitle'>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div><div class='wbox'>tester<a onclick='show("id6"); return false;' href=''>Reply</a>
<span style='display:none;position: relative;' id='id6'><form action='u.php' method='put' >
<textarea name='comment' cols='35' rows='3'></textarea>
<input name='commentid' type='hidden' value='6'>
<input name='submit' type='button' value='Add Comment'></form></span>
</div>
</body>
</html>
Hello.. I've been working on this site for my Daughter using Wordpress, I've mashed about the CSS, Modding a template for the desired look for the site. I've tied validating it and it brings up a couple of strange comments about the </body> and </html> closing tags, I presume this is why IE7 is having problems displaying the page. Firefox doesn't seem to have an issue at all. I was hoping somebody could take a look at the source with a fresh set of eyes and let me know what is wrong, I've spent hours working on this and can't see it for the life of me. I'm sure it's something simple, I know I had an issue one time where a <P> tag wasn't closed and stopped the whole site being displayed... thanks. blog.mirana[dot]co[dot]uk I use the same css for all page, but one of them doesn't show sidebar and push down the footer about 100px Code: http://elsoszabadmagyarkormany.com/torveny-szavazasok/ Anybody can help me? They work in IE but not FF. Does anyone know a work-around? Is it possible? Code: .blkbars {
SCROLLBAR-FACE-COLOR : #000000;
SCROLLBAR-HIGHLIGHT-COLOR : #CCCCCC;
SCROLLBAR-SHADOW-COLOR : #FFFFFF;
SCROLLBAR-3DLIGHT-COLOR : #000000;
SCROLLBAR-ARROW-COLOR : #CCCCCC;
SCROLLBAR-TRACK-COLOR : #999999;
SCROLLBAR-DARKSHADOW-COLOR : #000000;
}
Thanks for your time! |
|||||||