SitePoint Sponsor

User Tag List

Results 1 to 15 of 15
  1. #1
    SitePoint Zealot
    Join Date
    May 2005
    Location
    London
    Posts
    96
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Internet Explorer doesn't centre

    Hi
    I have an ASP page with a container defined as follows:
    #container {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    background-repeat: no-repeat;
    background-position: top left;
    width: 1024px;
    height: 764px;
    }
    It centres fine in every browser I've tried except IE (I'm using IE8). The first lines of the page itself are:
    <%@LANGUAGE="VBSCRIPT" CODEPAGE="1252"%>
    <!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" xml:lang="en" lang="en">
    <meta http-equiv="X-UA-Compatible" content="chrome=1">

    Can any kind soul see why IE should stubbornly left-align it?

    Many thanks.
    Soft and Sound

  2. #2
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,633
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Hi, I don't know what VBScript is outputting (If I remember, vbscript is just like Javascript, just a different scripting engine). THough that also looks like ASP with the <&#37; so I am probably just ramblign now )

    If something is above the doctype then IE goes into quirks mode and it behaves more like IE5. IE5 doesn't allow auto margins to work (a different centering technique is used, not needed here though)

    Remove any g enerated code that comes above the doctype and it should all go well .
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  3. #3
    SitePoint Zealot
    Join Date
    May 2005
    Location
    London
    Posts
    96
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the tip, but I'm afraid it didn't work. I brought the Language line down below the DocType, HTML and Meta lines, but IE still fails to centre.

    Back to the drawing board....
    Soft and Sound

  4. #4
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,633
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Can you post a link to the site wehre this is happening? For all IE to not center it has to be in quirks mode and there are only so many ways that can happen .
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  5. #5
    SitePoint Zealot
    Join Date
    May 2005
    Location
    London
    Posts
    96
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the offer. The page is www.thehill.org.uk.
    Soft and Sound

  6. #6
    SitePoint Addict
    Join Date
    Apr 2010
    Posts
    14
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I see no DOCTYPE. While real browsers conform to standards and center your page, IE needs a DOCTYPE as the first line on a page.

    BTW - 1024px wide is not very friendly to those with 1024px wide screens or smaller. Especially those like me with the task bar on the side and/or windows not maximized. I suggest the more common 960px for a fixed width.

    Cordially, David

  7. #7
    SitePoint Zealot
    Join Date
    May 2005
    Location
    London
    Posts
    96
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Oops! I must have deleted the line when I was shifting it to the top.

    Doh....

    Thanks.
    Soft and Sound

  8. #8
    SitePoint Zealot
    Join Date
    May 2005
    Location
    London
    Posts
    96
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    But no! The doctype line is there in the page, but for some reason or other is being stripped out on load. I double-checked this on Chrome; it happens there too, but Chrome doesn't care and centres nonetheless.

    There's another page, also called index.asp, which is the home page for the park (http://thehill.org.uk/park/index.asp). I've made sure the doctype and html lines are identical, but the problem persists, while the park home page carries on centring.

    I've checked all the syntax and can't see any <% or other tags that aren't closed.

    Talk about weird. Any ideas?

    Thanks.
    Soft and Sound

  9. #9
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,633
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Chrome doesn't need a doctype to use auto margins. IE does.

    Post the original code (before a browser parses it) of the page (if the code is too complex you will need to go to the ASP (I believe <&#37; is ASP) forum here
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  10. #10
    SitePoint Zealot
    Join Date
    May 2005
    Location
    London
    Posts
    96
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Many thanks for the offer - here's the code (below). As I say, I'm just about certain I haven't any unclosed tags or ASP delimiters.
    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" xml:lang="en" lang="en">
    
    <&#37;@LANGUAGE="VBSCRIPT" CODEPAGE="1252"%>
    <% Dim message %>
    
    <% Sub DrawPage %>
    
    <%Response.Expires = -1 %>
    <%Response.Expires = 0 %>
    <%Response.ExpiresAbsolute = Now() - 1 %>
    <%Response.AddHeader "pragma", "no-cache" %>
    <%Response.AddHeader "cache-control", "private" %>
    <%Response.CacheControl = "no-cache" %>
    
    <% Response.Expires = -1000 %>
    <% Response.Buffer = True %>
    <% Response.Clear %>
    
    <!--#include file="eventsconn.asp" -->
    
    <% 'declare variables %>
    <% Dim myconn, rstEvents, sqlSelect, sidebarheight %>
    
    <% ' connect to database %>
    <% set myconn = server.CreateObject("ADODB.Connection")  %>
    
    <% myconn.open(MM_myConn_STRING) %>
    
    <% 'prepare the sql statement %>
    <% sqlSelect = "SELECT * FROM qryEventsComingUp" %>
    
    <% 'create recordset %>
    <% set rstEvents = CreateObject("ADODB.Recordset") %>
    <% rstEvents.Open sqlSelect,myconn,1,1 %>
    <% if not rstEvents.eof then %>
        <% if rstEvents.RecordCount > 6 then %>
            <% sidebarheight = 770 + ((rstEvents.RecordCount - 6) * 50) %>
        <% else %>
            <% sidebarheight = 770 %>
        <%    end if %>
    <% else %>
        <% sidebarheight = 770 %>
    <% end if %>
    
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Welcome to Telegraph Hill</title>
    <!--#include file="menucss.html" -->
    </head>    
    
    <body>
    
    <div id="container">
        <div id="banner"></div>
        <div id="today">
            <% =FormatDateTime(Date(),vbLongDate) %>
        </div>
        <!--#include file="menus.html" -->
        <div id="homepic"><img src="images/galleries/homepics/rotate.php"  alt="Rotating images of Telegraph Hill" width="994" height="728" border="0" /> 
        </div>
        <div id="welcome">
            <h1><a href="http://www.boldvision.org.uk/" target="_blank">
            <img src="images/boldvisionlogo.jpg" alt="Bold Vision" width="80" height="88" border="0" /></a></h1>
            <h1><img src="images/elltrain.JPG" alt="East London Line train" width="175" height="103" /></h1>
            <p class="thbodysmall" align="left">
            It's back!   Dalston to New Cross and New Cross Gate, limited preview service now open. <a href="http://www.tfl.gov.uk/corporate/projectsandschemes/5011.aspx" target="_blank">Details...</a> </p>
          </div>
        <div id="news">
            <h1>Say no to railway cuts:</h1>
            <p><a href="http://www.gopetition.com/petitions/opposing-cuts-to-southern-services-to-forest-hill.html"><img border="0" width="206" alt="GoPetition" src="http://www.gopetition.com/counters?pid=30683&t=2" height="60" title="Opposing Cuts to Southern Services via Forest Hill (powered by GoPetition)"/></a></p>
          </div>
        <div id="sidebar" style='height: <% =sidebarheight %>px;'>
            <div id="weather">
                <div style='height: 48px;' >
                    <script src='http://netweather.accuweather.com/adcbin/netweather_v2/netweatherV2.asp?partner=netweather&tStyle=normal&logo=1&zipcode=EUR|UK|UK001|LONDON|&lang=uke&size=7&theme=clouds&metric=1&target=_self'></script>
                </div>
                <div style='text-align: center; font-family: arial, helvetica, verdana, sans-serif; font-size: 10px; line-height: 12px; color: #;' >
                    <a href='http://www.accuweather.com/world-index-forecast.asp?partner=netweather&locCode=EUR|UK|UK001|LONDON|&metric=1' target="_blank" style='color: #' >Weather Forecast</a>
                </div>
            </div>
            <div id="clock"> 
    <table border="0" cellspacing="0" cellpadding="0"><tr><td align="center"><script type="text/javascript" src="http://www.worldtimeserver.com/clocks/embed.js"></script><script type="text/javascript" language="JavaScript">objGB=new Object;objGB.wtsclock="wtsclock001.swf";objGB.color="6495ED";objGB.wtsid="GB";objGB.width=75;objGB.height=75;objGB.wmode="transparent";showClock(objGB);</script></td></tr></table>
            </div>
    
            <div id="events">
                <form id="login" action="validate.asp" method="post">
                    <fieldset>
                        <legend>
                            <% If Message = "" then %>
                                Log in to post events
                            <% Else %>
                                <% =Message%>
                            <% End If %>
                        </legend>
                        <table border="0" width="180" cellpadding="0" cellspacing="0">
                            <tr>
                                <td width="71" height="22" align="right" valign="middle">
                                      <label>Username:&nbsp;</label>                            </td>
                                <td width="174" valign="middle" align="left" height="22">
                                    <input type="text" name="username" size="14" />                            </td>
                            </tr>
                            <tr>
                                <td width="71" height="22" align="right" valign="middle">
                                    <label>Password:&nbsp;</label>                            </td>
                                <td width="174" valign="middle" align="left" height="22">
                                    <input type="password" name="userpassword" size="14" maxlength="12" />                            </td>
                            </tr>
                            <tr>
                                <td valign="middle" align="center" height="28">
                                    <p align="center">&nbsp;</p>                            </td>
                                <td valign="top" align="left" height="28">
                                    <input type="submit" value="Submit" name="submit" />                            </td>
                            </tr>
                            <tr>
                                <td height="30" colspan="2" align="left" valign="top" >
                                    <p>
                                      <a href="eventsreg.asp">Need to register?</a>
                                    <a href="forgot.asp">Forgotten your password?</a><br />
                                    <a href="events.asp">Show all events</a>
                                    <a href="eventnew.asp">Add your own</a>                                </p>                            </td>
                            </tr>
                        </table>
                    </fieldset>
                </form>
                <h1>Coming up soon</h1>
                <table border="0" width="210" cellpadding="0" cellspacing="0">
                    <tr valign="top">
                        <td colspan="2" align="left">
                            <p>
                            <% while not rstEvents.eof %>
                                <a href="eventdetails.asp?eventid=<% =rstEvents("lngEventID")%>&amp;back=-2">
                                <strong><% =rstEvents("strTitle") %></strong></a>
                                <% =rstEvents("strLocation") %><br />
                                <% =FormatDateTime(rstEvents("dteStartDate"),1) %>
                                <%if rstEvents("dteEndDate") <> rstEvents("dteStartDate") then %>    
                                    to
                                    <% =FormatDateTime(rstEvents("dteEndDate"),1) %>
                                   <% end if %>
                                   <br /><br />
                                <% rstEvents.Movenext %>
                            <% wend %>
                                 </p>                      </td>
                    </tr> 
                </table>
          </div>
        </div>
    </div>
    </body>
    </html>
    <% End Sub %>
    <% Message = Session("Message") %>
    <% Session("Message") = "" %>
    <% Call DrawPage %>
    Last edited by Paul O'B; May 5, 2010 at 05:19. Reason: code tags added
    Soft and Sound

  11. #11
    SitePoint Zealot
    Join Date
    May 2005
    Location
    London
    Posts
    96
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I should add that the first includes is a connection string setup, and the second brings in the CSS file and a load of stuff to construct the dropdown menus, using Jquery. The latter is identical in the park page - http://thehill/park/index.asp, but here's the first one, in case it has any bearing on things:

    <%
    ' FileName="Connection_ado_conn_string.htm"
    ' Type="ADO"
    ' DesigntimeType="ADO"
    ' HTTP="false"
    ' Catalog=""
    ' Schema=""
    Dim MM_myConn_STRING
    MM_myConn_STRING = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" & server.MapPath("events.mdb") & ";Persist Security Info=False"
    %>

    It does seem mighty odd that two lines can be stripped out of a page like this.

    Thanks again.
    Soft and Sound

  12. #12
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,633
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Well taht ASP looks too advanced for me (I thougth that I could follow the general syntax based on my PHP knowledge) although even though it is similar I can't find the culprit that could be causing the doctype to not show.

    I know with PHP if you are opening a port to a database and if you are sending any headers it should be in the first lines of the docujent (well the headers need to be)

    Try placing the Doctype and HTML tag after teh ASP code (so it matches up with <head> and the rest of the document)

    If that doesn't work then go to the ASP forum to see why it is doing that.
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  13. #13
    . shoooo... silver trophy logic_earth's Avatar
    Join Date
    Oct 2005
    Location
    CA
    Posts
    9,013
    Mentioned
    8 Post(s)
    Tagged
    0 Thread(s)
    http://validator.w3.org/check?verbos...hehill.org.uk/

    You are missing the head section, no DOCTYPE or HTML element.
    So try what Ryan suggested, move those next to the HEAD element.
    Logic without the fatal effects.
    All code snippets are licensed under WTFPL.


  14. #14
    SitePoint Zealot
    Join Date
    May 2005
    Location
    London
    Posts
    96
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Bingo! Thanks to you both - it did the trick.
    Soft and Sound

  15. #15
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,633
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    WOooo!! . Glad it worked.
    Always looking for web design/development work.
    http://www.CodeFundamentals.com


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
  •