locked
What's Wrong? RRS feed

  • Question

  • ?Can anyone tell me what's wrong with this code? It came from page 70 of Step by Step HTML and XHTML. EW 4 doesn't like it; gives a squiggly red line underneath the whole line of code.

    <hr style="color: green; background-color: green; height: 3" />

    I checked it in w3Schools and it seems to be OK, but the line generated from the 'Try It' box is black instead of green. Also, IE, Chrome and Safari show black lines, while Firefox and Opera show the green lines. I've tried both 'green' and the hex number (#008000) with the same results; red squiggly lines.

    Nancy Ward
    Windows 8 BetaFerret
    Please Don't Text and Drive
    My Grand Kids May be in Your Path


    Nancy Ward
    Monday, February 7, 2011 5:14 PM

Answers

  • Really? I just copied and pasted this line

    <hr style="color: green; background-color: green; height: 3px" />

    directly into EW's code view. No squigglies at all. What doctype are you using?

    BTW, the version I provided above also does not produce squigglies, and renders as expected in all major browsers. Just FWIW... ;-)

    cheers,
    scott


    Please remember to "Mark as Answer" the responses that resolved your issue. It is common courtesy to recognize those who have helped you, and it also makes it easier for visitors to find the resolution later.
    • Marked as answer by Nancy Ward Monday, February 7, 2011 9:04 PM
    Monday, February 7, 2011 5:49 PM
  • What does EW say is wrong?  If you didn't already know this, hover your mouse over where it is indicating a problem, and EW will show you an explanation of the problem (which may or may not be clear to you, but often does point to the solution).

    FYI: <hr style="color: green; background-color: green; height: 3" />

     gives a red squiggle error under the 3, for the reasons Scott said, not a squiggle under the whole line.

    <hr style="color: green; background-color: green; height: 3px" />

    gives no errors at all.  If you are seeing an error, you need to tell us what EW says it is.  I suspect it has something to do with markup not in that line itself.

    • Marked as answer by Nancy Ward Monday, February 7, 2011 9:04 PM
    Monday, February 7, 2011 6:02 PM
  • No, that didn't do it, Scott. :( As I type in the new line, everything looks OK until I enter the /> and then up pops the squiggle.

    Hmmm...doctype issue maybe?
    Expression Web MVP
    • Marked as answer by Nancy Ward Monday, February 7, 2011 9:04 PM
    Monday, February 7, 2011 7:20 PM

All replies

  • <hr style="color: green; background-color: green; height: 3 " />

    When specified as a CSS property, with few exceptions numeric values must include a specified unit. Try this

    <hr style="color: green; background-color: green; height: 3px" />

    and see if that gets rid of the squigglies. BTW, AFAIK the CSS property "color" refers to text. I've not seen it used before to assign color to an element which cannot contain a text node.

    [EDIT: Noticed that I hadn't addressed the other part of your question. Try this, which renders nicely in IE, FF, Chrome, and Safari:


    Oops! Hmm, first time I've seen that happen. I pasted the HTML markup to create the HR, and got the actual HR. Let's see if I can get the markup in here...

    <hr style="border:1px solid green; height:3px; background-color:green; width:400px;margin:0 auto;" />

    There we go. I wish I could figure out how I got that HR to display without having to edit the post's HTML... ;-) ]

    cheers,
    scott


    Please remember to "Mark as Answer" the responses that resolved your issue. It is common courtesy to recognize those who have helped you, and it also makes it easier for visitors to find the resolution later.
    • Edited by paladyn Monday, February 7, 2011 5:46 PM
    Monday, February 7, 2011 5:20 PM
  • No, that didn't do it, Scott. :( As I type in the new line, everything looks OK until I enter the /> and then up pops the squiggle.

    Nancy Ward
    Windows 8 BetaFerret
    Please Don't Text and Drive
    My Grand Kids May be in Your Path


    Nancy Ward
    Monday, February 7, 2011 5:36 PM
  • Really? I just copied and pasted this line

    <hr style="color: green; background-color: green; height: 3px" />

    directly into EW's code view. No squigglies at all. What doctype are you using?

    BTW, the version I provided above also does not produce squigglies, and renders as expected in all major browsers. Just FWIW... ;-)

    cheers,
    scott


    Please remember to "Mark as Answer" the responses that resolved your issue. It is common courtesy to recognize those who have helped you, and it also makes it easier for visitors to find the resolution later.
    • Marked as answer by Nancy Ward Monday, February 7, 2011 9:04 PM
    Monday, February 7, 2011 5:49 PM
  • What does EW say is wrong?  If you didn't already know this, hover your mouse over where it is indicating a problem, and EW will show you an explanation of the problem (which may or may not be clear to you, but often does point to the solution).

    FYI: <hr style="color: green; background-color: green; height: 3" />

     gives a red squiggle error under the 3, for the reasons Scott said, not a squiggle under the whole line.

    <hr style="color: green; background-color: green; height: 3px" />

    gives no errors at all.  If you are seeing an error, you need to tell us what EW says it is.  I suspect it has something to do with markup not in that line itself.

    • Marked as answer by Nancy Ward Monday, February 7, 2011 9:04 PM
    Monday, February 7, 2011 6:02 PM
  • No, that didn't do it, Scott. :( As I type in the new line, everything looks OK until I enter the /> and then up pops the squiggle.

    Hmmm...doctype issue maybe?
    Expression Web MVP
    • Marked as answer by Nancy Ward Monday, February 7, 2011 9:04 PM
    Monday, February 7, 2011 7:20 PM
  • "paladyn" wrote in message news:ff4e1205-6827-406a-8950-f6a33e99480d@communitybridge.codeplex.com...

    Really? I just copied and pasted this line

    <hr style="color: green; background-color: green; height: 3px" />

    directly into EW's code view. No squigglies at all. What doctype are you using?

    BTW, the version I provided above also does not produce squigglies, and renders as expected in all major browsers. Just FWIW... ;-)
    ==============
    I'm leaving the whole text because I need to address what I have finally figured out . . .

    I've been using doctype:
    <!DOCTYPE HTML PUBLIC "-//W3C/DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> which came with the practice files from my 2006 edition of "Step by Step HTML and XHTML". I'm also using EW 4 instead of notetab for working with the files.

    Using DOCTYPE HTML 4.01 Transitional, I typed the code exactly as listed in the book, and as listed by you, there were always squiggles.

    Using DOCTYPE XHTML 1.0 Transitional (the default doctype in EW), I typed the code exactly as listed in the book, and was rewarded with no squiggles.

    Regardless of which doctype I used, the lines were produced in all the browsers I used. However, when using HTML 4.01 Transitional, some browsers produce black lines, while others produced green lines.

    That said, when I used DOCTYPE XHTML 1.0 Transitional, every browser produced green lines. Yay!

    One last thing . . . I think I can change the doctype in the practice files to XHTML 1.0. Am I correct in this assumption?

    Thanks for your help. It's much appreciated.
    --
    Nancy Ward
    Windows 8 BetaFerret
    Please Don't Text and Drive
    My Grand Kids May be in Your Path


    Nancy Ward
    Monday, February 7, 2011 7:29 PM
  • >> If you are seeing an error, you need to tell us what EW says it is.  I suspect it has something to do with markup not in that line itself.

    Good Grief, Kathy! It tells me: "This element is not allowed to be self closing in the current schema. Remove the closing slash."

    And no, I wasn't aware of the 'hover' feature. Thanks!

    Nancy Ward
    Windows 8 BetaFerret
    Please Don't Text and Drive
    My Grand Kids May be in Your Path


    Nancy Ward
    Monday, February 7, 2011 7:33 PM
  • >Hmmm...doctype issue maybe?

    Yup, that's keerect. Scott's questions started me to experimenting and let me figure this one out. And, Kathy's 'hover' feature showed me a bit more.

    Woodja say I've got a lot to learn? :) I surely am glad youse guys and gals are here.

    Nancy Ward
    Windows 8 BetaFerret
    Please Don't Text and Drive
    My Grand Kids May be in Your Path


    Nancy Ward
    Monday, February 7, 2011 7:37 PM
  • It is considered appropriate to Mark as Answer the response(s) which addressed your question. Just sayin'...  ;-)

    cheers,
    scott


    Please remember to "Mark as Answer" the responses that resolved your issue. It is common courtesy to recognize those who have helped you, and it also makes it easier for visitors to find the resolution later.
    Monday, February 7, 2011 8:05 PM
  • >It is considered appropriate to Mark as Answer the response(s) which addressed your question. Just sayin'...  ;-)

    Yup, heading that way now. Seems to me that I got "answered" by all three of you. :)

    Nancy Ward
    Windows 8 BetaFerret
    Please Don't Text and Drive
    My Grand Kids May be in Your Path


    Nancy Ward
    Monday, February 7, 2011 9:02 PM
  • ""This element is not allowed to be self closing in the current schema. Remove the closing slash.""

    Yep, that's your answer.  <  /> - self closing, XHTML.  <  > Not self-closing - HTML.  Your doctype was the root trigger for the squigglies.  When you copy examples, it helps if you have already gone through the HTML and XHMTL tutorials (see the before posting post).  The XHTML one is quite short, just focusing on the differences.   You'd then be able to recognize what syntax was being used in the examples you follow, and adjust accordingly.

    Monday, February 7, 2011 10:27 PM
  • >When you copy examples, it helps if you have already gone through the HTML and XHMTL tutorials (see the before posting post).

    Kathy, I've gone through the sticky and cannot find anything relating to "HTML and XHTML" tutorials. I'm either blind as a bat or it's well hidden. :( Could it be listed under something that I'm not aware of?

    Nancy Ward
    Windows 8 BetaFerret
    Please Don't Text and Drive
    My Grand Kids May be in Your Path


    Nancy Ward
    Tuesday, February 8, 2011 12:21 AM
  • Under Resourses.  Tutorials at w3schools.com.
    Tuesday, February 8, 2011 12:24 AM
  • >Under Resourses.  Tutorials at w3schools.com.

    Ahhh! I have been using that resource all along. When I get into trouble, I usually check there first to see what I may have done wrong.

    Thanks.

    Nancy Ward
    Windows 8 BetaFerret
    Please Don't Text and Drive
    My Grand Kids May be in Your Path


    Nancy Ward
    Tuesday, February 8, 2011 12:39 AM