Home/ Questions/Q 724499
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-14T06:13:47+00:00

I have a problem with rendering my html page by the same browsers in

  • 0

I have a problem with rendering my html page by the same browsers in different OS.
There are 3 spans and position of each span is corrected through css(position:relative).
But I have found out that the page that looks correct in firefox under Linux, shows not right at the same firefox(3.5.7) under Windows OS.

Linux(Left – How it should be)/Windows(right): link text

And the same with other browsers. What is the cause of this problem and how is possible to solve it.
My code:
question.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <title>Question</title>
        <link href="css/question.css" rel="stylesheet" media="all" />
    </head>
    <body>
        <div class="eventFullDate">
            <span class="eventYear">2010</span>
            <span class="eventDate">17</span>
            <span class="eventMonth">FEB</span>
        </div>
    </body>
</html>

question.css:

html, body{
    font-family: Georgia;
}
div.eventFullDate{
    height: 39px;
    width: 31px;
    float: left;
    border: 1px solid;
    border-color: #E3E3E3;
    background-color: #F7FFFF;
}

span.eventYear, span.eventDate, span.eventMonth{
    color: #EC5C1D;
    position: relative;
    width: 100%;
}

span.eventYear{
    left: 1px;
    bottom: 3px;
    font-size: 0.8em;
}

span.eventDate{
    left: 5px;
    bottom: 12px;
    font-size: 1.3em;
}

span.eventMonth{
    left: 3px;
    bottom: 15px;
    font-size: 0.8em;
}
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You should use a CSS-reset, it will help standardize your css for better cross browser compatibility: http://developer.yahoo.com/yui/reset/

    Also, you have this

    html, body{
 font-family: Georgia;
}

    I am guessing one of your OS does not have the Georgia font. Probably the Windows one.

    • 0