CSS - Confusing [simple] Css Parse Error
Hi all,
Has anyone received a Line: 0 Parse error - Unrecognized : } with the rest of the CSS document validated under W3C validator? I can't work out why it's not happy. The beginning of my CSS is: /* This is the only CSS for the Waste RE3 website */ a:link { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 12px; font-style: normal; color: #008000; text-decoration: none} a:visited { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 12px; font-style: normal; color: #008000; text-decoration: none} a:hover { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 12px; font-style: normal; color: #FF9933; text-decoration: underline} Similar TutorialsI am getting a CSS validation error It is: 251 * Parse Error / textarea { border: 1px solid silver; width: 80%; } If I comment the CSS in question out, it gives me another CSS error a little bit farther down in the stylesheet... not sure why it is doing that or how to just fix this validation error, as the ones that come up after it are similar. My end goal is to make the page look normal in FF2. Currently in FF2 some of the text in the purple "Sesame Street" box is blocked out. I didn't create this page, but have been asked to figure out why it looks like this in FF2. I am no CSS expert, but would love to hear from one! Thanks for your help. When trying to validate my CSS with W3C, I keep getting parse error on this code :- ul#menu li a.home:hover, ul#menu li a.home:active, ul#menu li a.port:hover, ul#menu li a.port:active, ul#menu li a.multi:hover, ul#menu li a.multi:active, ul#menu li a.web:hover, ul#menu li a.web:active, ul#menu li a.about:hover, ul#menu li a.about:active, { background-position: center center; } The code is part for a horizontal 3 state navigation menu using images. I have created my first css and all has worked well, but when I try to validate it I get the message: Parse error - Unrecognized : <style type="text/css"> body { margin:10px 10px 0px 10px; padding:0px; } Can someone please explain what I'm doing wrong and how do I fix it? Desperately a student, Hi, How do I fix this? My Stylesheet validates except for this one issue. It bugs me Here's the HTML page: Code: <div id="nav"> <img class="navrightendbutton" src="images/buttonleftend.jpg" alt="Graphic Helper" /> <a href="index.html"><img class="navbox" src="images/homelight.jpg" alt="Takes You to Home Page" style="filter:alpha(opacity=0)" onmouseover="pWidgets(this,100,50,5)" onmouseout="pWidgets(this,0,50,5)" /></a> <a href="guardian_angel_figurines_store.html"><img class="navbox" src="images/storelight.jpg" alt="Guardian Angel Store" style="filter:alpha(opacity=0)" onmouseover="pWidgets(this,100,50,5)" onmouseout="pWidgets(this,0,50,5)" /></a> <a href="about_figurines.html"><img class="navbox" src="images/aboutfigurineslight.jpg" alt="For More Information About Figurines" style="filter:alpha(opacity=0)" onmouseover="pWidgets(this,100,50,5)" onmouseout="pWidgets(this,0,50,5)" /></a> <a href="about_angels.html"><img class="navbox" src="images/aboutangelslight.jpg" alt="For Angelic Understandings, Mysteries and More" style="filter:alpha(opacity=0)" onmouseover="pWidgets(this,100,50,5)" onmouseout="pWidgets(this,0,50,5)" /></a> <a href="privacy_policy_statement.html"><img class="navbox" src="images/contactuslight.jpg" alt="To Contact Us with Your Questions, Sugestions, Ect" style="filter:alpha(opacity=0)" onmouseover="pWidgets(this,100,50,5)" onmouseout="pWidgets(this,0,50,5)" /></a> <img class="navbox" src="images/buttonrightend.jpg" alt="Graphic Helper" /> </div> Here's the CSS code: Code: #bodycontainerbox { float:left; background: #993399; width: 900px; padding-bottom: 7px; } .navbox { float:left; width: 126px; } .navrightendbutton { float: left; width: 125px; } W3C gives me this error fives times: Parse Error opacity=0) Thank you I have a website that I have been working on. The site is http://timberlinecs.com. It is using a drop-down menu on the "services" button. I have it looking perfect in IE8 but it goes haywire in firefox. If I get it looking right in firefox, then it don't work in IE8. This is the CSS that works in IE8: Code: .anylinkcss{ position: absolute; margin-top:5px; margin-right:50px; margin-left:-215px; visibility: hidden; font: normal 14px Tahoma; line-height: 18px; z-index: 100; /* zIndex should be greater than that of shadow's below */ background: ; width: 160px; /* default width for menu */ } .anylinkcss ul{ left: 0; padding: 5px; list-style-type: none; } .anylinkcss ul li a{ display: inline-table; background-color: transparent; background-image: url(http://timberlinecs.com/images/button.png); background-repeat: no-repeat; width: 155px; height: 45px; padding: 0 0 0 0; text-align: center; vertical-align: middle; font-family: Tahoma; color: #ffffff; font-size: 14px; font-weight: bold; text-decoration: none; } I can not for the life of me figure this out. Please help. I purchased 3rd party tool and the sample code uses the following CSS which I have never seen and do not understand: .item { position: relative !important; display: inline-block; *display:inline; overflow: hidden; } and * HTML .c2 { -margin-left: 0px; } First - what is the use of "*" in the above. Secondly - what is use of HTML in the above Thirdly - what does "-margin-left:0px" do? I am not very good at CSS but Google returned noting on the * and HTML uses. So thanks for any input. John Here's something I ran into today, that I'd never seen before. Here's the page as it SHOULD be -- http://www.globalmedical1.com/index_826.cfm with the paragraph text small enough not to expand the graphics, but I heard from a friend that on HIS browser (not sure how his settings were), it looked like THIS: http://www.globalmedical1.com/index_825.cfm http://www.globalmedical1.com/gmerror.jpg (To achieve the look for the file link, I gave it a <font size> command after the calling in the <div> property of the paragraph text. The image was actually how it looked. On his system, apparently, it didn't seem to pick up the CSS value I had set for the paragraph, which was .demo { font-family:tahoma; font-size: 8pt; color:061D71; } How can it make a font size of 8pt THAT big ? Hi, I am trying to center my page wrapper. It centers in FF, but not IE. I just cannot see what is wrong. This is my CSS: PHP Code: body{ margin: 0 auto; } #wrapper{ width: 900px; margin: 0 auto; } Any ideas? I'm teaching myself CSS and enjoying it, but I run into problems every now and then that I'm having troubles with. In my table I call <td class="corner">, but the bgcolor tag I set in my CSS sheet is not being picked up. I've run my code through the validator and it tells me that my line Quote: property bgcolor doesn't exist : #666666 This is my CSS code: Code: td.corner { bgcolor: 666666; height: 30px; width: 15px; } I've played around with this, it seems simple but can't see what I'm missing. ANy help would be appreciated! Thanks! http://lovemeforme.org/index.php?wptheme=Scarlett+Orange if you scroll down to where it has "themes" on the sidebar, you notice the last one isn't a link and says "scarlett orange." Why does it not go past the image bullet like the others, how can I fix that? any ideas? thanks in advance. Hi, I'm trying to use CSS and php includes to simplify my website admin. What I'm trying to do is create a banner area, a left column and a right column. Each section then calls another php page. I will eventually let the right column have the correct content instead of calling another page. My problem is that none of the basic formatting is being applied to my content. The menu.htm page in bold is also calling the style.css as is the c_index.php. I have tried seperating the layout CSS and the formating CSS but it did not make a difference. When I view both menu.htm and c_index.php in seperate windows they are affected by changes in the style.css! Would somebody be kind enough to explain where the error is? Here is my code: TEST PAGE Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml1-transitional.dtd"> <html> <head> <title>Planet Phillip</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <div id="banner"><?php include "header.php";?></div> <div id="leftcontent"><?php include "menu.htm";?></div> <div id="centercontent"><?php include "c_index.php";?></div> </body> </html> STYLE.CSS Code: a:active { font-family: Verdana; color: #003300; font-size: 10pt; style="text-decoration none" } a:link { font-family: Verdana; color: #003300; font-size: 10pt; style="text-decoration none" } a:visited { font-family: Verdana; color: #003300; font-size: 10pt; style="text-decoration none" } a:hover { color:#0000FF; text-decoration } .hline { height: 1; color: #003300; text-align: left; margin-top: -6; margin-left: 36; margin-bottom:0 } .date { font-family: Verdana; font-size: 10pt; font-weight: bold; text-align: left; margin-top: 0; margin-left: 36; margin-bottom: 0 } .project { font-family: Verdana; font-size: 10pt; margin-left:60; font-weight: bold; margin-top:12; margin-bottom:2 } .newsitem { font-family: Verdana; font-size: 10pt;font-weight: bold; margin-left:48; margin-right:0; margin-top:12; margin-bottom:8 font-style:italic } .newstext { font-family: Verdana; font-size: 10pt; text-align: justify; margin-left: 60; margin-top: 0; margin-bottom: 6 } .posted { font-family: Verdana; font-size: 10pt; text-align: right; margin-top:8; margin-bottom:30 } .listtext { font-family: Verdana; font-size: 10pt; text-align: left; margin-left: 60; margin-top: 0; margin-bottom: 6 } .tabletext { font-family: Verdana; font-size: 10pt; text-align: justify } .listsitem { font-family: Verdana; font-size: 10pt;font-weight: bold; margin-left:48; margin-right:0; margin-top:12; margin-bottom:-12; font-style:italic } .Mheader { font-family: Verdana; font-size: 10pt; font-weight: bold; text-align: right; margin-top: 0; margin-bottom: -18 } .Mlink { font-family: Verdana; color: #003300; font-size: 16pt; text-decoration: none; text-align: right; margin-bottom: 18 } #leftcontent { position: absolute; left:0px; top:150pt; width:120pt; } #centercontent { margin-top: 50pt; margin-left: 150pt; } #banner { margin-left: 60pt; margin-top: 30pt;} edit:figured out Hello Fellas: http://global.espritwebdesign.com/muros.html This webpage will display correctly on IE, Chrome and Safari But not on Firefox 11 What strikes me the most is the error is very odd. Im Clueless. Can you visite the web page see it for yourself, and maybe give me a hint what could be? Any clues? This is simple (I think) -- I'm a bit new to CSS and still learning, so I really appreciate any help you guys have to offer. I have this page - vitalmodels (DOT) com/V3/ The columns on the right/left, the backround extends past the bottom graphic. I basically need the bottom graphic to be at the literal bottom of the div container so that it closes off the box cleanly. I have tried vertical align/bottom/baseline to no avail. And this is only in mozilla/safari as well... Any suggestions? Also, a second question. The 3 columns (divs) in the main area, are within a single container div... they don't push that container down when populated with information, and merely overlap... right now I have the container set to a height in order to look decent, but when it's set to "auto" the content in the columns seems to do nothing. Again, I REALLY appreciate any help I get here... thanks again. -Ryan This is the code if you need it - PHP Code: #index_left_column { padding: 0px; float: left; height: auto; width: 194px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; position: relative; left: 16px; background-image: url(images/index/left_column_bg.jpg) and PHP Code: <div id="index_left_column"> <p><img src="images/index/left_column_featured_female.jpg" alt="" width="194" height="26" /></p> <?php include("inc/m_female.php"); ?> <p><img src="images/index/left_column_featured_male.jpg" alt="" width="194" height="25" /></p> <?php include("inc/m_male.php"); ?> <p><img src="images/index/left_column_featured_photog.jpg" alt="" width="194" height="25" /></p> <?php include("inc/m_photographer.php"); ?> <p><img src="images/index/left_column_bottom.jpg" alt="" width="194" height="7" /></p> </div> I think that this is something really basic but I just haven't been able to put my finger on the problem. Can someone please point me in the right direction? In IE 6 the cell background (as defined in CSS) or the table cell size is not correct, but it looks fine in FF. The test page is: http://www.kdays.com/box/kerrin.htm Hello ;> Basicly I'm trying to make several <p>s, that are situated 1 under the other. Each of them must hold 1 image that is on the LEFT side, so the text of the <p> will be on the right side of the image. [image] text <p> <img /> </p> thats how i did it. However when i put float: left, to the image as to fix it the IMG from the <p> below the 1st <p> overlaps the other so i tried and made a <div> between the <p>s with clear:both The problem with that is that IE leaves space between the <p>s while FF and Opera doesn't. Any way to fix that? Or a more correct way to do it ? Thanks! Hi... I was just wondering.. when u have something like: margin:5px 10px which side does the 5px and 10px apply to? thanks in advance hye peeps i need to create a external css for my website www. losttv . 50webs. com would someone please help me, i have no idea. ive made the site how i want it to look and i need the css else i wont pass my assignment. i have no idea how to create it either and have tried reading books? any advise would be SO welcome ricki I have a Class "fieldnameback" which is intended to provide the background to cells in a table containing field names.. the CSS code is: .TC width: auto; height: 36px; background-image: url("/e107_themes/grey33/images/p22_box_02-TC.png"); margin: 0 5px; .TL height: 36px; background-image: url("/e107_themes/grey33/images/p22_box_02-TL.png"); .TR height: 36px; background-image: url("/e107_themes/grey33/images/p22_box_02-TR.png"); What I cannot resolve is why the background produces a series of narrow bands which resemble my required background as opposed to continuous backgrounds for each cell. I am not yet allowed to post URL's so if anyone needs to see the problem please contact me direct. Can anyone help me please? Regards I'm looking for an easy to use WYSIWYG editor that works in CSS. In my admin (back end) panel right now, I'm set up with a regular editor that works with tables and I want to switch that out for a CSS editor. Two things to consider here....I have no CSS experience so I'm hoping that there's something out there that's as easy to use as TinyMCE which is what I have currently. The other point to consider is that I have no dynamic content on these pages. They are just simple and straight forward. Can anyone recommend something? Thanks! |