www.webdeveloper.com
Results 1 to 3 of 3

Thread: Help with CSS IE vs Firefox

  1. #1
    Join Date
    May 2011
    Posts
    5

    Help with CSS IE vs Firefox

    I am new to web developing , especially to separate CSS to Firefox and separate for IE7. So here is a thing that I am stuck with , I tried mostly everything , but seems like one browser renders the web page differently then the other.

    PHP Code:
    .inputboxSearch {
    position:relative;
    left:-5px;
    width406px;
    height70px;
    margin0 0 1em 0;
    border0px;
    background:url('resources/images/searchbackground.png'no-repeat right center;
    border-style:hidden;
    border-width:0px;
    padding-top:15px;
    padding-bottom:15px;
    padding-left:7px;
    padding-right:20px;
    font-size:16px;
    color#C35617;
    font-familytimesTimes New Romantimes-romangeorgiaserif;
    line-height40px;
    font-style:italic;
    }
    .
    searchbtn {
    padding-bottom:-15px;
    position:relative;

    So I have those two classes , the .inputsearch is the search box , obviously , and the searhbtn is the button.

    So here is a screenshot how it looks in IE7 :
    http://picturestack.com/740/931/lQUinternetexbEL.jpg
    and how it looks in Firefox:
    http://picturestack.com/740/931/MH7firefoxseaLMF.jpg

    Any help would be appreciated.

  2. #2
    Join Date
    Jul 2005
    Location
    USA
    Posts
    912
    Try just using :

    vertical-align:middle

    on both. Remove the negative padding
    Bitter web veteran

  3. #3
    Join Date
    May 2011
    Posts
    13
    Your line-height versus height + padding all over the place will cause you problems. Strip it right back with a decent reset, set a good vertical rhythm and apply minimal spacing on the form.

    Explore using input type image instead of background image on submit inputs.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles