www.webdeveloper.com
Page 1 of 2 12 LastLast
Results 1 to 15 of 16

Thread: my results are different despite seemingly using the exact same code!

  1. #1
    Join Date
    Jul 2014
    Posts
    44

    my results are different despite seemingly using the exact same code!

    http://www.w3schools.com/css/tryit.a...s_border-width

    can someone please explain to me why the borders of the blockquotes are all wonky for me, but in the following video, at the 6:50 mark, I have what I think is the same code in effect.

    thank you.

    https://www.youtube.com/watch?v=MABLK1iaEeg

  2. #2
    Join Date
    Jul 2014
    Posts
    44
    sorry, here is the code which I am apparently doing wrong...
    http://codepen.io/anon/pen/jBtgG

  3. #3
    Join Date
    Jul 2014
    Posts
    44
    when i assign each blockquote an id and style them separately i get the second one contained within the first one.

    http://codepen.io/anon/pen/mwKoh

  4. #4
    Join Date
    Jul 2014
    Posts
    44
    I figured it out. I'm an idiot. I was missing a slash in the fecking closing tag.

  5. #5
    Join Date
    Jun 2014
    Location
    Cairns - Australia
    Posts
    81
    Cool! you got it as I was about to reply... You still have 1 big booboo in the page?.... Cool to see you bought 'body' into play, thats what I was hinting at.. Its a big gun that will almost always be a part of your css... and as mentioned a big help for keeping general information, saving on repeat code...

    Still 1 error dude.. its a big one!

  6. #6
    Join Date
    Jul 2014
    Posts
    44
    ok most of that went right over my head, but thanks :P

    can you please tell me what the big error is? I've no experience whatsoever in coding, and everything i know has come from this one basic series on html.

  7. #7
    Join Date
    Jul 2014
    Posts
    44
    Quote Originally Posted by Code-tard View Post

    Still 1 error dude.. its a big one!
    do you mean the link rel? fortunately i embedded the stylesheet.

  8. #8
    Join Date
    Jun 2014
    Location
    Cairns - Australia
    Posts
    81
    Dude its time for you to take a time-out your pushing to hard.... you'll kick yourself...



    -------------------------------------------

    </style>
    </head>
    <body>
    <h1>My First Website</h1>

    <p>Welcome to my website! Here are some things I enjoy.</p>

    <li>Web Development</li>
    <li>Chess</li>
    <li>Reading</li>
    <li>Learning</li>
    </ul> /* Hello Im a </ul> tag my job is to be the end of a menu.. bit strange as I look up we never started one?*/

    <h4>Favorite Qoutes</h4>

    <blockquote id="firstquote">
    <p>
    Here is a Favorite quote of mine...
    </p>
    <blockquote>

    <blockquote id="secondquote">
    <p>
    ...and another
    </p>
    </blockquote>
    <ul> /* Hello Im a <ul> tag, my job is to start a menu.. but it looks like this guys done with the page and I dont have any menu */

    </body>


    --------------------------------------------------


    Time out dude!.....

  9. #9
    Join Date
    Jul 2014
    Posts
    44
    Quote Originally Posted by Code-tard View Post
    Dude its time for you to take a time-out your pushing to hard.... you'll kick yourself...



    -------------------------------------------

    </style>
    </head>
    <body>
    <h1>My First Website</h1>

    <p>Welcome to my website! Here are some things I enjoy.</p>

    <li>Web Development</li>
    <li>Chess</li>
    <li>Reading</li>
    <li>Learning</li>
    </ul> /* Hello Im a </ul> tag my job is to be the end of a menu.. bit strange as I look up we never started one?*/

    <h4>Favorite Qoutes</h4>

    <blockquote id="firstquote">
    <p>
    Here is a Favorite quote of mine...
    </p>
    <blockquote>

    <blockquote id="secondquote">
    <p>
    ...and another
    </p>
    </blockquote>
    <ul> /* Hello Im a <ul> tag, my job is to start a menu.. but it looks like this guys done with the page and I dont have any menu */

    </body>


    --------------------------------------------------


    Time out dude!.....
    damn, I guess as it didn't effect the results I didn't notice it. That, and I'm literally legally blind...

    can you explain to me why it worked fine once i put in the missing / in the blockquote closing tag? the list is a perfectly fine UL despite my mistake.

    thanks for your advice, but my problem is that i've not pushed myself hard enough my whole life, that's partly why these problems arise!

  10. #10
    Join Date
    Jun 2014
    Location
    Cairns - Australia
    Posts
    81
    Its ok.. very normal newbie stuff..

    Easy dude... minus a couple of tags everything needs a start and an end tag...

    <html> start
    </html> end


    some tags can go inside each other


    <ul> Im going to be a menu

    <li>Im a little piece of text</li> start & end (I dont know Im inside the menu tags, Im just me)
    <li>Im another piece of text</li>start & end etc etc

    </ul> and Im the end of this menu, case closed



    with your blockquotes you had something like this...

    <blockquote> - start
    Im the first quote

    <blockquote> - start
    Im the second quote inside the first..

    <blockquote> - start
    Im the third inside first & second

    </blockquote> - end (Im saying first quote end now.. second and third are still open!)



    What you needed was....


    <blockquote> - start
    Im the first quote
    </blockquote> - end


    <blockquote> - start
    Im the second quote
    </blockquote> - end


    <blockquote> - start
    Im the third quote
    </blockquote> - end


    Hope taht helped mate?

  11. #11
    In addition to your using an open <blockquote> instead of a closing </blockquote>, you didn't open your UL for the menu -- much less you shouldn't be using a H4 without a H3 or H2 preceeding it.

    See, a H1 is the heading under which everything on the page is a subsection -- H2's are the start of subsections of a H1, H3 are the start of a subsection of the H2, H4 are the start of subsections of the H3, and so forth... so with no H3 and H2, you shouldn't use a H4.

    Remember, HTML is for saying what things ARE, not what they look like. What they look like in fact has no business in your HTML, that's CSS' job.

    Which is why as a rule of thumb, you shouldn't use the STYLE tag or STYLE attribute either.

    Though you've developed good formatting habits -- that's nice. Just be sure to get in the habit of making sure you have all the right tags opened and closed properly. When in doubt, this reference:

    http://htmlhelp.com/reference/html40/

    has sections under each tag to say "contents" and "contained in" -- if "contents" says "empty", you don't have to close the tag, or in XHTML you can use the 'self closure' method. (long topic for another time). It says anything else there, you have to have matching openings and closures. The syntax section also helps.

    Take UL:
    http://htmlhelp.com/reference/html40/lists/ul.html

    Syntax: <ul>..</ul>

    You have a </ul> in your markup, but no matching <ul> at the start.

    Contents: One or more LI elements

    Which also means you have to have a </ul> as per the syntax. NO other tag can be a direct child of a UL. (people screw this up all the time).

    Learning how/where to place your openings and closures, as well as getting a handle on what tags are valid inside what other tags is the big first step; whenever you have doubts, go to a reference like that one for clarification. Honestly, you'd probably learn more by just going through all the tags in that reference and reading what they are for and where they can go, that whatever source you're learning from now -- at least once you have the rules of opening and closing tags down pat.
    Last edited by deathshadow; 08-02-2014 at 11:49 PM.

  12. #12
    Join Date
    Jul 2014
    Posts
    44
    thank you, i understand the concept of self closing tags, i think. basically, if there's nothing that is to be displayed in the browser window directly, it can be self closed?

  13. #13
    Quote Originally Posted by conchairtoe View Post
    thank you, i understand the concept of self closing tags, i think. basically, if there's nothing that is to be displayed in the browser window directly, it can be self closed?
    Kind-of, but not quite. IMG for example shows something, but is considered an "empty" tag.

    The concept of "empty" tags in the specification means a tag that cannot wrap other tags or CDATA (character data, aka text). For example:

    <img>some text</img>
    <br>some text</br>

    Is invalid gibberish, you don't use image or BR that way. Neither of those can 'wrap' other tags or flat text.

    At the same time:
    <div></div>

    Is NOT considered an "empty tag" by the specification, even if it is 'empty'... because it CAN hold other tags or text.

    The HTML specification uses the word "empty" a lot, but when they say it they don't mean a tag that doesn't contain anything, but one that cannot contain anything... a subtle philosophical difference lost on many, particularly the XML crowd.

    Really that's the only major difference between XHTML 1.0 and HTML 4.01 is how 'empty' tags are handled.

    <br> -- HTML
    <br /> -- XHTML

    <img src="temp.png" alt="html way">
    <img src="temp.png" alt="xhtml way" />

    That's the 'big' different twixt the two. Laughably, browsers don't ACTUALLY care, which is why HTML 5 lets you blindly mix-and-match them. (honestly it's one of the things I don't like about HTML 5, adding to the laundry list of things just plain wrong with it)

    For reference if you need it, the following are the 'current' tags that you can 'self close' for being 'empty':
    AREA, BASE, BR, HR, IMG, INPUT, LINK, META, PARAM

    There are others like INDEX, BASEFONT and APPLET, but really you have no business using those on any website written after 1997.

    Of course it's subtle distinctions like that which can drive you nutters if you're just starting out learning. WORSE, many alleged "experts" STILL never took the time to learn them, which is why so many websites are buggy broken wrecks. See the entire crowd that still writes their code like it's 1997, and until recently were throwing the 4 tranny doctype on it; today that's the crowd embracing HTML 5 while still sleazing out the same garbage code.
    Last edited by deathshadow; 08-03-2014 at 12:52 AM.

  14. #14
    Join Date
    Jul 2014
    Posts
    44
    thanks pal!

  15. #15
    Join Date
    Jun 2014
    Location
    Cairns - Australia
    Posts
    81
    Hey Con,

    Dude you're on fire.. kickin butt & taking names ... Ive had an awesome learning day too!... Will trade wisdom in a sec.. First just wanted to quickly apologize for nudging you in the direction of putting your CSS in the html page!...

    When I last played with css the mind set was.. If its just 1 page (as it often is for us newbies) go right ahead and put it in the page, makes no difference.. and only go to the effort of making an external file, if you know you'll use it for multiple pages!...

    When DS dropped the hint dont (as he does).. I went on the war path to find out why not (as I do)... Wow! what a game changer.. huge!

    I woke up this morning wanting to ask you guys... Why do people sometimes use

    <style>...</style>

    and other times use

    <style type="text/css">...</style>

    for their in page css.. that was really eating at me... I now know the answer...

    The answer is, it doesnt matter! does not matter! Bye Bye!...

    In my search for an answer I got into a subject that didnt just set off the light bulb.. it completely shattered the glass!... Responsive design and child style sheets! BOOM!!

    I was thinking of a html page as a stand-alone self sufficient item.. wow, how 1997 was that!... when the reality is, its the complete opposite!

    Its 2014.. You build the page with the raw valuables "The Content!"... then you pull in everything else from around you depending on its environment in the moment!... Huge mind set reset!...

    and can I just say, that sh-t is off the hook!... you guys are trippin man!

    DS..............

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles