SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Enthusiast Happyworker's Avatar
    Join Date
    May 2006
    Posts
    42
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Negative margins and backwards floats

    Hi all,
    I've been testing my poor brain for a week now trying get my blog layout consistant with the rest of my site. Pretty much there except now, I'm having problems with FF displaying the floats or margins wrong. Looks okay (but still needs work) in IE though?? Viewable here (css included).

    Any help would be appreciated.
    Cheers

  2. #2
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,478
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try validating your XHTML and CSS first. Usually, validating your code will solve the problem. And if it doesn't, you'll be better able to pin-point the exact cause of the problem.

  3. #3
    Caveat surfer Buddy Bradley's Avatar
    Join Date
    May 2003
    Location
    Cambridge, UK
    Posts
    2,366
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    None of the validation errors are layout related though?

    It looks like you're usind one of the templates from Layout Gala - try stripping out all the content and going back to the basics of the layout until you get it working cross-browser. Then add content back in until it breaks, and you can figure out which bit is causing the problem.

  4. #4
    SitePoint Enthusiast Happyworker's Avatar
    Join Date
    May 2006
    Posts
    42
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thank you all for your replies....yes that is a long word,. Actually, I was just testing posting garbage for testing purposes.
    After a long fight with this particular template, I have released myself from it. I now have a new template which I have manipulated to look very close to the rest of my site. It can be viewed here.
    Just a couple of questions that may be simple but I just can't figure it out.
    The search area in the header? In FF there is a one pixel space in-between the text input and the header line.....but in IE there is no space??
    How could I fix it to look like it does in FF?
    Here is the code.....I have crop the rest of the css and php out for easier reading.

    Code:
    #searchbox {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 1.2em;
    color:#ccc;
    float:right;
    margin-top:10px;
    margin-right:50px;
    border:0px;
    width:225px;
    height:18px;
    line-height:14px;
    display:inline;
    }
    #searchbox img {vertical-align:middle; padding-top:1px; border:0px; margin:0px;}
    
    div.searchbox span.label {float: left;text-align: right;}
    div.searchbox span.formw {float: right;text-align: left;} 
    
    input, textarea { font-family: Verdana, Arial, Helvetica, sans-serif; font-size:1.2em; color:#ccc; border: 1px solid #ccc; height:18px; line-height:14px; vertical-align:top; }
    /* mac hide \*/
    * html #searchbox {height:1%}
    /* end hide*/
    PHP Code:
    <div id="searchbox">
    <form id="searchform" method="get" action="<?php echo $_SERVER['PHP_SELF']; ?>">

    <span class="label">Blog 
    <img alt="search" src="../images/searchlgrey.gif"/></span>
    <span class="formw"><input name="s" type="text" value="<?php echo wp_specialchars($search_text1); ?>" id="searchinput" tabindex="1" size="15" />
    <input id="searchsubmit" name="searchsubmit" type="image" src="../images/GO2.gif" value="Find" tabindex="2" /></span>
        </form>
    </div>
    Thanks again for all your help.
    Cheers,
    Happyworker


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
  •