1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

I hate IE

Discussion in 'CSS' started by JahRasta311, Jul 16, 2009.

  1. #1
    JahRasta311, Jul 16, 2009 IP
    SEMrush
  2. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,401
    Likes Received:
    1,876
    Best Answers:
    245
    Trophy Points:
    515
    #2
    Well, the lack of a CSS reset could be making life a bit more difficult for you, the non-semantic markup most certainly are issues. (You have headings, lists and paragraphs, and yet you do not seem to have either of the latter for tags).

    I'm not sure what you mean by pushed down in IE - what version. I'm seeing the same appearance here in 7 and 8 as I do Opera and FF.... Though IE6 is completely screwed... (big shock) since it appears to be running the content text under your google ad - which IMHO is simply trying to get too fancy for your own good.

    I do think a LOT of your problem is all the positioned elements out of flow for your rounded corners. You are using ten separate images to do the job of one and relying on a positioning method that is very likely to break given said elements are nowhere near the position they would be 'in flow'. (which is probably why in FF I'm seeing the dancing pixel offset on the right)

    ... and word of advice (unrelated to your issue), get rid of that STUPID ***** CHIKITA LINX SCRIPTED BULL... all that does is piss off users. (I literally scream at the screen every time any of that type of crap shows up on a site - I then turn off javascript and hit refresh)
     
    deathshadow, Jul 16, 2009 IP
  3. JahRasta311

    JahRasta311 Peon

    Messages:
    201
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #3
    I was hoping you'd be around to answer this.

    What do you mean by a CSS reset?

    How would you go about arranging the page elements? The way I did it was the only way I could find that would let me have such a design, I'm sure there's a better, more simple way.

    I wouldn't use Chitika's inline ads if I could get my users to click enough to turn a meaningful profit. I don't get complaints about my ads because my users know that they're worthless leechers
     
    JahRasta311, Jul 16, 2009 IP
  4. Destinyx3

    Destinyx3 Peon

    Messages:
    430
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    0
    #4
    A CSS reset is simply adding this to your CSS:

    It's the simple way of resetting your CSS to be more compatible with different browsers. There are complicated ways that are more effective (i.e. Eric Meyer's Reset). * serves as a simple usage though.
     
    Destinyx3, Jul 16, 2009 IP
  5. JahRasta311

    JahRasta311 Peon

    Messages:
    201
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #5
    body
    {
    margin: 0;
    }

    doesn't cut it?
     
    JahRasta311, Jul 16, 2009 IP
  6. NickReffitt

    NickReffitt Peon

    Messages:
    34
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Use Eric Meyers reset stylesheet. I use reset stylesheets on every project of mine and it's very popular to do so.
     
    NickReffitt, Jul 16, 2009 IP
  7. Destinyx3

    Destinyx3 Peon

    Messages:
    430
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    0
    #7
    Yes, I would go with this option more than *. I have a seperate CSS Reset stylesheet that has Eric Meyer's Reset and more. You can find it here: http://serenedestiny.com/blog/development/open-thread-create-the-perfect-css-reset/

    But that is the simplest way to reset every single margin and padding.
     
    Destinyx3, Jul 16, 2009 IP
  8. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #8
    As I learned a while back, don't bother resetting margins and padding on elements who don't even have margins and padding (though * is so simple to select everything, I'll use it for margins). Also, why bother resetting other things, on elements which you don't even have? How about deprecated elements which you SHOULDN'T have? Why does Meyer have background: transparent on things which are transparent already? Why does he remove padding from the applet tag? Why are you using an applet tag? You'd better not be! Etc.

    Mostly, it's bloated and can maybe defend itself is very very large projects which, due to their size, are already using most of those elements and already has multiple CSS stylesheets (simply due to size and complexity).

    The only good thing I can say about Meyer's reset is it makes sure padding isn't stripped from form controls, the one dirty problem with
    * {
    margin: 0;
    padding: 0;
    }

    if you don't have any forms, the above is fine. Otherwise, try to look at a dropdown/select in Opera after removing padding. Now try to add it back in manually to the select/dropdown. Lawlz.

    body { margin: 0;}
    obviously only removes default margins from the body, and this does not cascade (a good thing, I think).


    My current reset (I'm still not sure if I have padding to remove in some of these!)

    
    * {
      margin: 0;
    }
    
    html, body, ul, ol, th, td {
      padding: 0;
    }
    (usually nobody is going to notice FF's 1px of padding on th's and td's, however they completely destroyed some calendar tables I had, and while I could have removed the padding locally, I'm lazy and like to expect no padding on those things, esp since not all other browsers add padding to them.  Still not 100% sure if lists in any browser have default padding.  We all know they have default margins to make room for bullets)
    
    img {
      border: 0;
      vertical-align: bottom;
    }
    
    Code (markup):
    That's about it, though I often have a ul {list-style: none;} since most sites I make don't have bulleted lists. Often there's a bit of code to give little pdf icons after anchors whose href's end in .pdf, but that's extra.
     
    Stomme poes, Jul 17, 2009 IP
  9. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,401
    Likes Received:
    1,876
    Best Answers:
    245
    Trophy Points:
    515
    #9
    I dislike meyers reset because it's just too damned big, and resets a bunch of crap that I either don't use, or don't use how he resets it.

    Right now I use:
    /* null margins and padding to give good cross-browser baseline */
    html,body,address,blockquote,div,
    form,fieldset,caption,
    h1,h2,h3,h4,h5,h6,
    hr,ul,li,ol,ul,
    table,tr,td,th,p,img {
    	margin:0;
    	padding:0;
    }
    
    img,fieldset {
    	border:none;
    }
    Code (markup):
    I really don't need more than that reset.

    If you are going to use forms at ALL, do NOT use the * { margin:0; padding:0; } approach as you will have nothing but headaches given how wildly different all the browsers treat form elements. That 'short' version is cute when prototyping, but really it's not something I'd deploy on a production site.
     
    deathshadow, Jul 17, 2009 IP
  10. kk5st

    kk5st Prominent Member

    Messages:
    3,499
    Likes Received:
    377
    Best Answers:
    29
    Trophy Points:
    335
    #10
    As far as I'm concerned, css "resets" are redundant bits of make-work, no more than time wasters. They are without redeeming social value.

    Rather than start anew with my arguments, see this CSSCreator thread on the subject.

    cheers,

    gary
     
    kk5st, Jul 17, 2009 IP
  11. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,401
    Likes Received:
    1,876
    Best Answers:
    245
    Trophy Points:
    515
    #11
    I would agree if all the browsers were on the same page for defaults - having to declare margins and padding EVERY time I make a declaration for the elements listed? **** that. Nab it once up top.

    At the same time Meyers reset? Over the top. I've never had the quotes problem with blockquote - I don't use short quote 'Q' becuase it is rarely appropriate to any content I write, list-style I may want overridden on menus, but I don't want it overrridden on content so why global reset it if all browsers START OUT WITH THE SAME DEFINITION... I think I just hit on the head my problem with meyer's take on a reset...

    It turns off values that have the same default in all browsers. The only reason to use a reset is to set things that are NOT the same on all browsers the same. This means the UL/OL for list-style, the text decoration **** on ins and del (how often do you use those in the first place?!?), the bizzare and pointless line-height on body (where you should be declaring the default font for your entire document ANYWAYS!!!) or even better, this 'gem' of his:

    /* tables still need 'cellspacing="0"' in the markup */
    table {
    	border-collapse: collapse;
    	border-spacing: 0;
    }
    Code (markup):
    You only 'really' need the collapse if you are using tables for layout - which you shouldn't be doing, and if you have to say cellspacing in the markup ANYWAYS why the *** waste time declaring border-spacing? That's just retarded... much less the obsession with breaking the default outline behavior, dicking with the vertical-align, and what the **** is up with the background declaration?!? It's wasteful nonsense and gives resets a bad name.
     
    deathshadow, Jul 17, 2009 IP
  12. JahRasta311

    JahRasta311 Peon

    Messages:
    201
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #12
    Deathshadow, hate to break up your tangent about CSS resets, however I'm really interested in knowing how you'd set this page up, since it's clear you know a lot more than me.
     
    JahRasta311, Jul 17, 2009 IP
  13. wd_2k6

    wd_2k6 Peon

    Messages:
    1,740
    Likes Received:
    54
    Best Answers:
    0
    Trophy Points:
    0
    #13
    It's no good just hating IE cause your site looks a mess in all browsers :)

    Rather than positioning everything on the page (via the position: property) it'd be better to let elements flow naturally within the document, without using the position propery, and then use floats, margin and padding to put what you want where you want.

    Don't get me wrong the position attribute can be used in select circumstances, but it's rare and should only be used or considered after you've grasped the concept of designing layouts without it.
     
    wd_2k6, Jul 19, 2009 IP
  14. JahRasta311

    JahRasta311 Peon

    Messages:
    201
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #14
    doesn't look like a mess in my browser.

    only the header and left sidebar are positioned along with the images for the border corners. tell me how to make it all work otherwise, and i'll be glad to make the changes just for you, bloody wanker.
     
    JahRasta311, Jul 19, 2009 IP
  15. wd_2k6

    wd_2k6 Peon

    Messages:
    1,740
    Likes Received:
    54
    Best Answers:
    0
    Trophy Points:
    0
    #15
    Well it sure looks like one in mine, and I can't be bothered to tell you my browser or my OS.

    I had just re-coded your page for you, but now i'm not going to post it up, it was good for refreshing my memory and a nice experience in learning to convert a pile of mess into something half decent at least.

    Let's see how far you get with your attitude...
     
    wd_2k6, Jul 19, 2009 IP
  16. kk5st

    kk5st Prominent Member

    Messages:
    3,499
    Likes Received:
    377
    Best Answers:
    29
    Trophy Points:
    335
    #16
    what you said.

    Tee hee. :D

    cheers,

    gary
     
    kk5st, Jul 19, 2009 IP
  17. JahRasta311

    JahRasta311 Peon

    Messages:
    201
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #17
    lol i called you a bloody wanker for what i perceived as an insult to my site. didn't think you'd take it so personally.
     
    JahRasta311, Jul 19, 2009 IP
  18. kk5st

    kk5st Prominent Member

    Messages:
    3,499
    Likes Received:
    377
    Best Answers:
    29
    Trophy Points:
    335
    #18
    So, why did you take it so personally? Your coding is a mess, and he took the time to clean it up. But you came back with a personal attack. Until you have found a modicum of clue, you'll probably find really good help hard to find.

    gary
     
    kk5st, Jul 20, 2009 IP
  19. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #19
    Wanna know somethin weird? esr says it's a good idea to learn HTML when you're on your way to becoming a l33t hax0r. I thought that was kinda cool.

    But then he said "learn XHTML because it's stricter". Wanker. : )

    To the OP: Looking closer at your site it really does seem to just be the header in the entirely wrong place (and the rounded corners, and yes, those little things could have ds' rounded corners without images technique). But on the bottom it says "best viewed in Firefox."

    Now I use firefox, but only because I don't like the alternatives much. It's a bloated, buggy browser. How again is this different than those little badges from the 90's: "Best Viewed In Internut Exploder 5 or Nutscrape Navigator7"

    Those were nasty. And there's still one on the Rainbow Jesus page:
    BEST VIEWED WITH
    INTERNET EXPLORER
    Forget all the other browsers and down with the Web 2.0 net police.

    rainbow jesus
    rainbow jesus
    rainbow jesus
    he's gonna walk on watah fo you
    rainbow jesus
    rainbow jesus
    rainbow jesus
    watcha gonna do
     
    Stomme poes, Jul 20, 2009 IP
  20. Wildhoney

    Wildhoney Active Member

    Messages:
    192
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    58
    #20
    And when it comes to JavaScript, IE is an utter nightmare!
     
    Wildhoney, Jul 20, 2009 IP