Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New Coder
    Join Date
    Jul 2011
    Posts
    20
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Question Mac vs. PC: Website Layouts

    I'm working on a Guild portal website, and I literally just finished the layout for the Portal Page. While it looks good through the browsers on my PC (Windows), the "Enter Site" button seems to be offset to the right on me mac, where I would like it to be centered.

    Does anyone know how to fix this?

    Temporary link:
    http://www.colossal3d.net/omnipotenceparadox/portal.php

  • #2
    Regular Coder
    Join Date
    Jun 2011
    Posts
    103
    Thanks
    0
    Thanked 13 Times in 13 Posts
    most likely has to do with the way your browser interprets the padding of your body image...I would tamper with this and confirm

  • Users who have thanked Fugix for this post:

    LRRoberts0122 (07-01-2011)

  • #3
    New Coder
    Join Date
    Jul 2011
    Posts
    20
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Yes, I think that's exactly what it is. I'm going to try to get rid of the padding and try something else. I'll let you know if it works.

  • #4
    Regular Coder
    Join Date
    Jun 2011
    Posts
    103
    Thanks
    0
    Thanked 13 Times in 13 Posts
    what exactly are you trying to accomplish with the padding?
    The padding does not effect anything in the body except for most likely your "ENTER SITE" image(s)

  • #5
    New Coder
    Join Date
    Jul 2011
    Posts
    20
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Solved

    You're right it was reading the padding wrong. I took out the padding from the left and instead inserted an HTML <center> tag.

    Here's the code that made it work:
    Code:
    <!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>Omnipotence Paradox Guild Portal</title>
    <style type="text/css">
    body {
        background-image: url(images/background.png);
        padding: 240px;
        background-repeat: no-repeat;
        background-position: center;
        background-color: #151515;
        padding-top: 540px;
    }
    </style>
    <script type="text/javascript">
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    }
    function MM_preloadImages() { //v3.0
      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    }
    
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    }
    
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    }
    </script>
    </head>
    
    <body onload="MM_preloadImages('images/bttn2.png')">
    <a href="http://www.colossal3d.net/omnipotenceparadox/home.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('enterButton','','images/bttn2.png',1)"><center><img src="images/bttn1.png" name="enterButton" width="176" height="62" border="0" id="enterButton" /></center></a>
    </body>
    </html>

  • #6
    Regular Coder
    Join Date
    Jun 2011
    Posts
    103
    Thanks
    0
    Thanked 13 Times in 13 Posts
    excellent, there are normally better ways of doing things like that rather than using huge padding or margin numbers. Good solution


  •  

    Posting Permissions

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