1. Welcome! Please take a few seconds to create your free account to post threads, make some friends, remove a few ads while surfing and much more. ClutchFans has been bringing fans together to talk Houston Sports since 1996. Join us!

[HELP] CSS Guru? Having problems with the IE font size on a Wordpress site.

Discussion in 'BBS Hangout' started by 3814, Dec 12, 2008.

Tags:
  1. 3814

    3814 Member

    Joined:
    Aug 4, 2002
    Messages:
    5,433
    Likes Received:
    72
    So I'm putting together a website right now - and I thought it was great until I had my fiancee check it out. I use Google Chrome and Mozilla Firefox and the site looks good in both...but she uses Internet Explorer and it is MESSED!

    If there's a CSS guru who can help me out it would be appreciated. I'll paypal $10 to the tipjar if you guys can help me get this working.

    Anyways - here's the site:

    http://SportsCopywriter.com

    Compare the page in IE and other browsers to see the issue. I'm sure I just need to make a few slight tweaks to the Stylesheet, but I'm not sure...

    SwoLy Disclaimer: I have not finished editing my copy (I did it at 2 in the morning) - so don't worry about the little errors. But if you see one, feel free to point it out :)

    Here's the body section of my stylesheet, by the way:

    body {
    background: #E0E0E0;
    color: #000000;
    font-size: 12px;
    font-family: Arial, Verdana, Sans-Serif;
    margin: 0px 0px 0px 0px;
    }

    body * {margin: 0px; padding: 0px;}
     
    #1 3814, Dec 12, 2008
    Last edited: Dec 12, 2008
  2. heypartner

    heypartner Member

    Joined:
    Oct 27, 1999
    Messages:
    63,511
    Likes Received:
    59,008
    there is nothing wrong with the css. your problem is malformed HTML. You have an unclosed tag that IE won't close for you, whereas Firefox tries to figure out want you meant to do.

    this line in your HTML is wrong:

    HTML:
    <h2><font color="#ff8500">Claim Your Newsletter</font></a>
    you failed to close the H2 tag. Plus the /a end tag is not associated with an openning tag.

    if you close the H2 tag, your page will render properly, like this:

    HTML:
    <h2><font color="#ff8500">Claim Your Newsletter</font></h2>
    furthermore, I saw an unclosed P tag for parapraph, further down in the page. That doesn't seem to create problems though.

    hope this works. and when you contribute $10, mention my name to Clutch. :)
     
    #2 heypartner, Dec 12, 2008
  3. 3814

    3814 Member

    Joined:
    Aug 4, 2002
    Messages:
    5,433
    Likes Received:
    72
    You rock...I'm paypalling the money now and will mention your name. Thanks!
     
    #3 3814, Dec 12, 2008
  4. SwoLy-D

    SwoLy-D Member

    Joined:
    Jul 20, 2001
    Messages:
    37,618
    Likes Received:
    1,456
    Unless you want EVERY element inside the "body" tags to have that entire code applied to them, DO NOT use the universal selector " * ".

    I do not suggest this at all, sir. When you apply this:
    Code:
    body {
background: #E0E0E0;
color: #000000;
font-size: 12px;
font-family: Arial, Verdana, Sans-Serif;
margin: 0px 0px 0px 0px;
}

body * {margin: 0px; padding: 0px;}
    It means that all body stuff and stuff inside body will be this:

    Code:
    body * (line 19)

{
   margin-top: 0px;
   margin-right: 0px;
   margin-bottom: 0px;
   margin-left: 0px;
   padding-top: 0px;
   padding-right: 0px;
   padding-bottom: 0px;
   padding-left: 0px;
}
    http://sportscopywriter.com/wp-content/themes/imwb-left-sidebar-1/style.css

    What I see with the * selector is that you will lose control of elements inside the BODY. Be careful with that. I am studying it a little more. :eek:

    Notes: you don't want to leave your email out there for spam robots to capture. Create a captcha-like form instead of leaving your personal email out there. :cool:
     
    #4 SwoLy-D, Dec 12, 2008
  5. 3814

    3814 Member

    Joined:
    Aug 4, 2002
    Messages:
    5,433
    Likes Received:
    72
    Well now you're playing over my head :)

    I appreciate the help SwoLy! But not really sure what I should do - it's going to be a static page, so I might just leave it alone if looks alright...or would you change the padding or margins to something else?

    Oh, and I'll make a image for my email addy right away. I think i'll just make the "@" sign an image...that'd work, right?
     
    #5 3814, Dec 12, 2008
  6. SwoLy-D

    SwoLy-D Member

    Joined:
    Jul 20, 2001
    Messages:
    37,618
    Likes Received:
    1,456
    Nah. I'd leave the margins as they are, but all I was saying was to be careful with the universal selector. You can do individual padding and margins with specific tags, instead of with * . It looks nice and smooth... and so does the web page. ;)
     
    #6 SwoLy-D, Dec 12, 2008
  7. 3814

    3814 Member

    Joined:
    Aug 4, 2002
    Messages:
    5,433
    Likes Received:
    72
    Thanks! I don't care for the body font right now, but it's finally coming together. I learned a lot while putting this site together :cool:
     
    #7 3814, Dec 12, 2008
  8. ClutchCityReturns

    ClutchCityReturns Member

    Joined:
    Apr 26, 2005
    Messages:
    13,427
    Likes Received:
    2,666
    Slightly off topic and possibly offensive, but I would do a little Photoshop work on the picture of the guy (you?) in the banner. He looks like a little under the weather in that picture. Some slight color adjustments could go a long way.
     
    #8 ClutchCityReturns, Dec 12, 2008
  9. 3814

    3814 Member

    Joined:
    Aug 4, 2002
    Messages:
    5,433
    Likes Received:
    72
    hmmm...good point. the pic (yeah me) actually looks way brighter and full of color in photoshop - but it seems to lose something when saving to jpeg...i'll see what i can do. thanks!
     
    #9 3814, Dec 12, 2008
(You must log in or sign up to post here.)

Share This Page