SitePoint Sponsor

User Tag List

Page 2 of 2 FirstFirst 12
Results 26 to 45 of 45
  1. #26
    SitePoint Wizard jag5311's Avatar
    Join Date
    Jan 2003
    Location
    Somewhere in Indiana
    Posts
    3,082
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    42 is my guess, maybe even 40.

  2. #27
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Off Topic:

    I feel like a preschooler in this thread

  3. #28
    SitePoint Wizard megamanXplosion's Avatar
    Join Date
    Jan 2004
    Location
    Kentucky, USA
    Posts
    1,099
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by r937
    danson, them's fighting words

    paul, would you please set up a challenge for the two of us

    these are the conditions: no hacks, no spans, no divs, must validate xhtml strict and css1

    danson, are you game? put up, or, as the kids say, stfu

    I'd like to see a contest like that. I will not work according to a timer (like this competition was ran), but I would be more than happy to take a swing at completing the challenge. I love experimenting around with CSS in ways that most people won't

    Off Topic:

    vgarcia: I would be a toddler then hehe. I'm only 19


    Edit - Danson: It is entirely possible to complete a CSS-challenge without using divs, spans, tables, images, etc. A little bit of clever thinking and document manipulation will go far ^_^

  4. #29
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,271
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Off Topic:


    Quote Originally Posted by bryan
    42 is my guess, maybe even 40.
    hey I guess I'm wearing well as your out by 10 years lol


    Quote Originally Posted by megaman
    but I would be more than happy to take a swing at completing the challenge.
    I haven't posted the solution to the current one yet in case anyone else wants to try and make it work. Nick is the only one so far and his solution was more or less identical to mine but I'd be interested to see any other solutions. Hey there might even be a solution without hacks ( but I doubt it ).

    I'm working on another test that doesn't use hacks so hopefully that will keep everyone happy

    Paul

  5. #30
    SitePoint Wizard jag5311's Avatar
    Join Date
    Jan 2003
    Location
    Somewhere in Indiana
    Posts
    3,082
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Off Topic:


    So is tha 50 or 52

  6. #31
    SQL Consultant gold trophysilver trophybronze trophy
    r937's Avatar
    Join Date
    Jul 2002
    Location
    Toronto, Canada
    Posts
    39,215
    Mentioned
    58 Post(s)
    Tagged
    3 Thread(s)
    next month, i turn 20,000!! what a nice round number!!

    rudy.ca | @rudydotca
    Buy my SitePoint book: Simply SQL
    "giving out my real stuffs"

  7. #32
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,271
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by bryan
    So is tha 50 or 52
    52 next august


    Quote Originally Posted by rudy
    next month, i turn 20,000!!
    Is that dollars or pounds ?

  8. #33
    SQL Consultant gold trophysilver trophybronze trophy
    r937's Avatar
    Join Date
    Jul 2002
    Location
    Toronto, Canada
    Posts
    39,215
    Mentioned
    58 Post(s)
    Tagged
    3 Thread(s)
    well, let's see

    it can't be years, it can't be months, it can't be weeks...

    and 20,000 hours would make me just under 2 years old

    so it's gotta be....? anyone? buehler?
    rudy.ca | @rudydotca
    Buy my SitePoint book: Simply SQL
    "giving out my real stuffs"

  9. #34
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,271
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Off Topic:


    Hmmm - let me see...

    Its either 14 days old approx (20,000 minutes)

    or could it be nearly 55 years old (20,000 days)

    I wonder which one it is

    Paul

  10. #35
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,271
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    Well no-one apart form Nick (doctornick) has offered a solution to this (with or without hacks) so here's the answer.

    This was the orignal page that only worked in mozilla browsers etc.

    http://www.pmob.co.uk/temp/spointquizq.htm

    Heres the solution that works both in ie6 and firefox as per the challenge.

    http://www.pmob.co.uk/temp/spointquiza.htm

    If you remember the original problem was that there didn't seem to be anyway to keep the element on the bottom of the window and keep it a set distance form the top.

    I gave a big clue in the first post by saying that only the css needed changing plus one other thing in the head of the page. Nick was quick enough to spot that the only thing to make a difference to the page would be the doctype. As I stated that the page had to be valid xhtml the solution was to use the xml prologue to force ie into quirks mode.

    What good is that? - I hear you say. Well if you remember that ie6 in quirks mode uses the broken box model which puts padding and borders inside the element and not added to it as per the standard.

    This allows as to specify a 100% height for the body but to also set padding that still keeps the total height at 100%.
    Code:
    * html body {height:100%;margin:0;padding:180px 0 20px 0}
    The star selector hack is used to give the style to ie only because as we know mozilla already works fine.

    The padding top on the body is set to 180px which makes the page start 180px from the top. This keeps the page 180px from the top and also resting on the bottom at all times.

    The next step was to remove the header from the flow and place it absolutely otherwise the header would start at 180px from the top. The header is placed absolutely at the top of the page i.e. the body outside of the margins I set.
    Code:
    * html #header {position:absolute;top:0;left:0;}
    The last step was just to hide the #content element from each browser as the postioning is now different for both browsers. The child selector was to use to give mozilla values and the star selector used to give Ie6 its values.
    Code:
    html>body #content {
     position: absolute;
     overflow: auto;
     top: 180px;
     left: 20px;
     right: 20px;
     bottom: 20px;
     padding: 10px;
     background:#fff;
    }
    * html #content {
     height:100%;
     margin:20px;
     padding-bottom:20px;
     overflow:auto;
     position:relative;
     z-index:100;
     background:#fff;
    }
    Thats it I hope you enjoyed it and sorry that it wasn't hack free but each version will actually work without hacks but not in both browsers at the same time unfortunately .

    Congratulations to Nick and keep a lookout for my next quiz which will be hack free (with any luck )

    Paul

  11. #36
    SitePoint Wizard jag5311's Avatar
    Join Date
    Jan 2003
    Location
    Somewhere in Indiana
    Posts
    3,082
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    uhhh, yea, I would have definitly not been able to figure that out I am what you call a "css moron" , but I do have my moments of brilliance.

  12. #37
    SitePoint Zealot Octal's Avatar
    Join Date
    Feb 2003
    Location
    UK
    Posts
    145
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I am what you call a "css moron"
    I think I am as well. I got lost after quirks mode. Maybe I will come back and re-read the solution after I am done with my search on "divitis"
    Octal - All your base-8 belong to us
    "Knowing is not enough, we must apply.
    Willing is not enough, we must do." - Bruce Lee

  13. #38
    SitePoint Guru
    Join Date
    Feb 2004
    Location
    Oregon
    Posts
    686
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    just an FYI,

    I have seen mozilla read this

    * html #header {position:absolute;top:0;left:0;}

    you should include the tag you want it to be on then mozilla won't read it.

    * html div#header {position:absolute;top:0;left:0;}

    I know this cause I tried to z-index somethnig to a -1 in IE and mozilla read it and blanked the page out. and yes it was a z-index: -1 as mozilla hates that.
    success is not by chance, it is by choice.

  14. #39
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,271
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    [quote=sahajin]
    I have seen mozilla read this
    * html #header {position:absolute;top:0;left:0;}
    [/code]

    Not in any mozilla browser that I've ever tested - all will ignore it. Could you please post examples as this would be extremely interesting.

    According to all sources i've seen IE is the only browser that incorrectly parses the * html (star selector hack).

    For mozilla to parse this on odd occasions just wouldn't make sense. I feel you must have made some error somewhere. The universal selector on its own will be parsed by mozilla and other browsers as it is like a wild card that matches any element.

    The reason mozilla doesn't parse * html is that there would need to be a parent of html in order for it to work. As we all know html is the root element which is why this combination fails in all browsers except IE.

    Regarding negative z-indexes mozilla will put the element behind the body and if the body is not transparent then the element will not show. For this reason negative z-indexes are unpredicatable and should be used with caution.

    In css2.1 the stacking rules have been changed so that an element can never be stacked below the background of its stacking context.

    Paul

  15. #40
    SitePoint Guru
    Join Date
    Feb 2004
    Location
    Oregon
    Posts
    686
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I totally agree with you. everything I read said the same, mozilla shouldn't read it. but wouldn't you know it now that I want it to happen I can't get it to do it. it must have been a combination of other things that I had. I swear all I changed was that hack and added the tag to it. then it stopped.

    my appologies for steering everybody the wrong way I'll be quiet now
    success is not by chance, it is by choice.

  16. #41
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,271
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    I'll be quiet now
    lol - don't worry you still may be right Theres always the exception to the rule! A thing is only true until its proved false (or vice versa) .

    Paul

  17. #42
    SitePoint Enthusiast
    Join Date
    May 2004
    Location
    Sweden
    Posts
    31
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Woo, I guessed I learned all my CSS from W3C, making me total unaware of the different hacks you pro's are using. The star selector hack will become most useful, thanks alot. I think i stumbled over it sometimes before but never bothered to fully understand its advantages. It's a shame we need it, really.

    Also, the child selector was new to me. Refering to html>body. What does it do? As I understand Moz will use it but not IE. Is it a hack or real CSS? What do other browsers like Opera think of this?

    I know this is kind of off topic, hope you don't mind since competition on this thread is already finished.
    Tudor

  18. #43
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,271
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Also, the child selector was new to me. Refering to html>body. What does it do? As I understand Moz will use it but not IE. Is it a hack or real CSS? What do other browsers like Opera think of this?
    The child selector is valid CSS, its just that IE doesn't understand it and ignores the whole style. Most other modern browsers understand it and will parse the styles correctly.

    A > B will select any element B which is a child of element A. Any grandchildren will not be selected as they won't match.

    My opinion of hacks is that you should do everything you can to avoid them but if you still need to use them then use them sparingly and use the well established ones that are unlikely to cause problems in the future.

    See here for more information:

    http://www.info.com.ph/~etan/w3panth...ifiedsbmh.html

    Hope that helps.

    Paul

  19. #44
    SitePoint Enthusiast
    Join Date
    May 2004
    Location
    Sweden
    Posts
    31
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Very helpful indeed(unfortunately), thanks a lot =)

  20. #45
    SitePoint Enthusiast
    Join Date
    May 2009
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Smile

    Wow, this is such a good idea. I've read books about PHP and mySQL and sat down at the computer clueless because I remember best what I do. I was hoping somebody somewhere would have something where I could code in CSS and am CORRECTED so I can learn more.


Bookmarks

Posting Permissions

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