SitePoint Sponsor

User Tag List

Results 1 to 6 of 6

Thread: Scalability?

  1. #1
    SitePoint Zealot
    Join Date
    Aug 2005
    Posts
    163
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Scalability?

    Is there any way to make tables scalable? For example I am trying to make this table oriented site (since CSS was not cross compatible in IE/FF for some reasons) scalable, is it possible? What needs changing?

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
    <title>3 Column Layout</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <style type="text/css">
    * {
    margin:0;
    padding:0;
    }
    BODY {
    background-color:#000;
    font-size:16px;
    }
    a {
    color:#807859;
    text-decoration:none;
    }
    a:hover {
    text-decoration:underline;
    }
    .header {
    background-color:#000;
    padding:8px;
    }
    .topleft {
    background-color:#990000;
    color:#FFFFFF;
    }
    .midleft {
    background: url("http://www.roma-victor.com/images/col_bg_l.jpg");
    width:10em;
    background-color:#000;
    }
    .bottomleft {
    line-height: 129px;
    background: no-repeat url("http://www.roma-victor.com/images/col_bot_l.jpg");
    background-color:#000;
    }
    .topmiddle {
    }
    .middle {
    color:#FFFFFF;
    background-color:#000000;
    }
    .bottommiddle {
    color:#FFFFFF;
    background-color:#000000;
    }
    .topright {
    background-color:#990000;
    color:#FFFFFF;
    }
    .midright {
    background:url(pillar.jpg);
    width:10em;
    background-color:#000;
    }
    .bottomright {
    line-height: 129px;
    background:no-repeat url(pillarbottom.jpg);
    background-color:#000;
    }
    .leftdivider {
    padding-left:15%;
    }
    </style>
    </head>
    <body>
    
    <div class="leftdivider">
    <table width="80%" cellpadding="0" cellspacing="0">
    
    <tr>
    <td class="topleft">
    <center>
    Online Users<br />
    ---<br />
    Test1<br />
    Test2<br />
    </center></td>
    <td class="topmiddle"><img src="http://www.calracia.com/cr_banner.png" /></td>
    <td width="15%" class="topright">
    <center>
    Online Users<br />
    ---<br />
    Test1<br />
    Test2<br />
    </center></td>
    </tr>
    
    <tr>
    <td class="midleft">&nbsp;</td>
    <td class="middle">
    <p>
    Welcome to the home of Legio XVIII, also known as the 18th, a roleplaying Legion guild for the historically authentic Roman Empire MMORPG, Roma Victor.
    </p><p>
    Seeking enlistment within the ranks of the 18th Legion? Register with our Forums and tell us about yourself.
    </p>
    <p>
    September 17, 2006
    </p><p>
    The 24th and 28th Legions officially merged today on the steps of the temple of Jupiter, under the watchful eye of the bust of our benevolent Emporer, Commodus. Under command of Legatus Numerius Ageus Barrius and newly appointed Tribunus Laticlavius, Marcus Felix Volaginius, the 18th Legion has officially been born. May the gods watch over Rome's greatest Legion and marvel at its future accomplishments.
    </p><p>
    An auxiliary cohort has been officially connected with the 18th Legion. Led by Prefect Wilrad Vlad Herrad, the Cohors I Britannica has marched into southwest Caledonia. May Mars bless the courageous soldiers of this honourable unit.
    </p>
    <td class="midright">&nbsp;</td>
    </tr>
    
    <tr>
    
    <td class="bottomleft">&nbsp;<br/></td>
    <td class="bottommiddle">&nbsp;<br/></td>
    <td class="bottomright">&nbsp;<br/></td>
    
    </tr>
    </table>
    </div>
    </div>
    </body>
    </html>

  2. #2
    SitePoint Wizard bronze trophy DaveWoods's Avatar
    Join Date
    Dec 2004
    Location
    Derbyshire - UK
    Posts
    2,651
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Firstly, CSS is cross browser compatible so you must have been doing something wrong. People that complain about CSS aren't usually using it correctly

    By scalable I assume you mean the text size? The text-size you have won't scale in IE6 or below because you are using fixed font-sizes. Change this to a % or em and you'll find that it scales perfectly. Try 100% and if it's too big, try 90% etc

    If you mean something else and this doesn't help then please elaborate on the problem.

  3. #3
    SitePoint Wizard bronze trophy DaveWoods's Avatar
    Join Date
    Dec 2004
    Location
    Derbyshire - UK
    Posts
    2,651
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Also if you're going to claim that your HTML document is XHTML 1.1 standards compliant then you really should validate it

  4. #4
    ********* user
    Join Date
    Mar 2006
    Location
    Malta
    Posts
    312
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    With the release of IE7, A page viewed correctly in Firefox should in theory be viewed correctly in IE7 and Opera.

  5. #5
    SitePoint Zealot
    Join Date
    Aug 2005
    Posts
    163
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well the problem (according to someone far more knowledgable than me ) was that the images were being padded in FireFox, and not in IE. So when it came to them aligning (pillar bottom aligning with pillar), there was a line dissecting it.

    By scalability, I mean't that when viewed in 800x600, it completely distorts the view of the site.

  6. #6
    <code></code><WoW></WoW> nukeemusn's Avatar
    Join Date
    Apr 2006
    Location
    Honolulu, HI
    Posts
    329
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    To fix browser default padding issues, I usually start my css wil this:

    *
    {
    margin: 0px;
    padding: 0px;
    }

    This way, no matter what browser is being used, the only margin/padding values in effect are ones that I define myself.
    My Blog
    The Obsidian Order - WoW Guild on US-Nagrand
    nukeemusn = Nuclear Electricians Mate US Navy


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
  •