HTML5 Doctype causing styling to be ignored?!

You should go to the web critique section of this website. It would be wrong for us to critique it here. We aren’t supposed to :).

Head on over there and follow the guidelines (3 reviews must be done in order for you to post a thread there)

As for the red box, it depends on whhat is going to be there. You could set the parent to position:relative, and have the red box be position:absolute and position it down there :).

[QUOTE=team1504;5079713

Also, one more question, I tried to get the red-box to be in the bottom-right-hand corner of #container. Any ideas on how to put it there?

Thank you all again! :)[/QUOTE]

Ryan answered that above and you set a stacking context on #container using position:relative (which you already have) and then you can just position the red box with absolute positioning at bottom:0;right:0;. You will of course need to make content avoid it though by either adding some padding to the bottom of the container or by adding padding-bottom to the last static element in that section.

Oh okay. I was using position:fixed; I always co fuse fixed and absolute and don’t know when to tell the difference. :eek:

Thank you.

I dont think ive ever used the critique forum before. Thank you for pointing that out Ryan.

Ill make a post and get back to you guys with url in case you have any comments, suggestions, or critique.

Tjhe only difference between fixed/absolute is tht fixed will hold it in place on hte screen, even when you scroll. Absolute won’t :).

oh okay. fixed fixes the object in the same place on the screen while absolute fixes in the sample place in the layout? I don’t know if I said that correctly, but I got it now.

Also, I don’t know if any of you are familiar with the review forums, but I tried posting there twice, after doing 3 reviews, and after submitting the new thread, it went to the forum again. My thread was not there and when I checked my latest threads, the thread wasn’t it that list either. Any idea why this is occurring?

Yes you got it right :).

I was reading some reviews you did, and it’s possible they fell short of the length. Moderators have to approve the thread first by checking that you did 3 reviews that met the criteria. I’d possibly PM a moderator in that section of the forum and see what’s up.

To be honest, I’d guess the reviews were too short (I believe it’s 2 PARAGRAPHS minimum), but I could be wrong.

Review requests go into a moderation queue to be vetted by Advisors so that they meet the requirements. Once approved they will appear in the forum but may take a couple of days depending on what else is there :). (I’ve approved it now anyway so you should be able to see it.)

Oh okay. Well I find this trade for me giving reviews and getting reviews interesting. Im more than happy to give more indepth reviews :slight_smile:

Thank you Paul for approving it for me.

Now, if either of you have any comments or suggestions on the layout you’ve helped me with, Please feel free to do so here: http://www.sitepoint.com/forums/showthread.php?838634-Please-Review-my-new-layout-design-for-my-portfolio&highlight=

I would really appreciate any and all feedback :)I
and of course, thank you for the help:)

Regards,
Team 1504

Fixed relates to the viewport. Your coordinates are based off the corners of the screen itself, not the web page or content inside. Scrolling doesn’t change where the viewport is, so the element doesn’t move.

Absolute relates to whoever the nearest positioned ancestor is; if there isn’t one, the viewport (the specs say “otherwise the viewport” but really, it’s the top of the document. Which is why the abso-po’d element can scroll offscreen).

A positioned ancestor is any parent element (or grandparent or great-grandparent) who has either position: relative or position: absolute set on them.

So sometimes you see an element with position: relative on it, but no coordinates like left or top. Likely, they either wanted to absolutely position a child (the top left corner of the position: relative element is 0,0 to the abso-po child)… or they wanted to set a z-index. Otherwise, they were probably just wasting code for no reason :slight_smile:

seriously thank you for that in-depth explanation. Thats one of the many things that I love about SPF, that I can get help and learn from it. :slight_smile: