The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Trying to centre page
Cairney
post Mar 20 2009, 02:36 PM
Post #1





Group: Members
Posts: 1
Joined: 20-March 09
Member No.: 8,122



I'm trying to get my page in the centre of the page, both horizontally and vertically but I'm not sure how. Could someone look at the pages HTML and change it so it will stay in the centre no matter what size screen its on?

CODE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Impero :: Violation</title>
    <meta http-equiv="content-type"
        content="text/html;charset=utf-8" />
    <style type="text/css">
<!--
.style1 {
    font-family: "Times New Roman", Times, serif;
    color: #000000;
}
.style2 {color: #000000}
.style3 {font-family: "Times New Roman", Times, serif}
.style4 {font-size: 16px}
.style6 {color: #000000; font-size: 16px; }
-->
    </style>
</head>

<body style="background-color: #FFFFFF; text-align: center; color: #FFFFFF; font-family: 'Times New Roman', Times, serif;">
<div class="greenBorder" style="display: table; height: 400px; #position: relative; overflow: hidden; padding: 100px;">
<div style=" #position: absolute; #top: 50%;display: table-cell; vertical-align: middle;">
<div class="greenBorder" style=" #position: relative; #top: -50%">

<div align="center"><img src="http://imperodenied.webs.com/websiteban.gif" width="300" height="250">
  </p>
  
  <p class="style2 style1 style4">The CONTENT of the web site you are trying to access contains something on the INTERNET </p>
  <p class="style2"><span class="style6"><span class="style3">Policy blocking this:</span></span><b><br />
    <br />
  </b>  </div>
</div></div></div>
</body>

</html>


I'll be grateful with any help.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Mar 20 2009, 02:59 PM
Post #2


WDG Member
********

Group: Root Admin
Posts: 8,365
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



Please see Centring using CSS and Centering things.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
domaincrossroad
post Mar 31 2009, 11:25 AM
Post #3





Group: Members
Posts: 2
Joined: 31-March 09
Member No.: 8,199



Cairney-

you will need to enclose your coding with div tags. An example is shown below.

<html>
<head>
<style>
body
{
margin:0 0 0 0;
text-align:center;
}
div#container
{
margin:0 auto;//change 0 to a positive number to pull the element down off of the top of the screen
width:xxxpx;//change xxx to the width of the element that you are trying to center
}
</style>
</head>
<body>

<div id="container">

//Your coding

</div>

</body>
</html>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Brian Chandler
post Mar 31 2009, 01:32 PM
Post #4


Jocular coder
********

Group: Members
Posts: 2,460
Joined: 31-August 06
Member No.: 43



QUOTE(Cairney @ Mar 21 2009, 04:36 AM) *

I'm trying to get my page in the centre of the page, ...



Evidently you are not as confused as you think you are, since you have managed to write the problem in the first phrase of your post. So a good subject would have been "Trying to centre page" (or lots of variations "Page centring"... etc)

Hope this helps for next time!
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 2nd May 2024 - 11:05 PM