PDA

View Full Version : Web Page to fit screen


neo
01-14-2006, 05:02 AM
Hi, I'm currently creating a web page using Dreamweaver.
My question is, how do l create a web page that will shrink
or grow depending on how large my web browser or monitor size is.

I will be creating a web page where everything is centered in the middle
of the page. I want to make sure the web page doesn't get cut off depending
on the monitor size.

If anyone could help, it would be greatly appreciated.

Thank You

Creative Insanity
01-14-2006, 05:19 AM
Have a read of this ('http://www.dreamweaverclub.com/css-center-content.php') I am sure it will fix your problem.

neo
01-14-2006, 07:33 AM
Thanx for your help Creative Insanity, that came in handy.
I notice that the code works good if I normally drop in text or an image.
But if I draw a layer box, and place content inside the wrapper code it
doesn't work on the layer box.

How can I get the wrapper code to also effect the layer box.
I'm not a programmer, so any help would be appreciated.

Thank You

Creative Insanity
01-14-2006, 08:35 AM
Use percenages for your tables.

I have created a VTM on control tables that might do the trick for you. Click on the logo and then click on the Control Table link under the logo there in the dark green area.

LNinio
01-31-2006, 03:09 PM
I do what the "Center content with CSS" says but i have some problems!!!
Where am i supposed to put the "THE HTML" (<div class="wrapper"> all page content goes here </div>)? What does it mean... "all page content goes here"?
The "THE CSS" content i am supposed to put into the css at the beginning of thw html page?

Is there any other way to do that... except css?

domedia
01-31-2006, 03:42 PM
short answer, you need to learn some HTML, quick.
If you want to make websites (which are written in HTML/CSS/JS), you need to at least have a basic understanding of them :)
But then again CI just might make a video tutorial on this ;D

LNinio
01-31-2006, 04:22 PM
I know few... but i know nothing about css
a video tutorial on tham matter would be just great

EDIT: Done!!! I couldn't understand thw... stracture of the tutorial, that' s why!!! Nice. That's great. Thanks guys.
I will be hear more and more.
CU

domedia
01-31-2006, 05:38 PM
Happy to hear that LNinio :)
Cheers!

LNinio
01-31-2006, 07:06 PM
But, the problem with the Firefox remains even if I did what tutorial says! The site is stuck on the left!!! With IE, everything is OK

domedia
01-31-2006, 07:43 PM
Time to post some code :)

LNinio
01-31-2006, 08:18 PM
Here we goooooo...

<!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>


<link rel="shortcut icon" href="http://users.hol.gr/~lninio/favicon.ico">
<link rel="icon" type="image/png" href="http://users.hol.gr/~lninio/favicon.png">


<meta http-equiv="Content-Type" content="text/html; charset=windows-1253" />
<title>LNinio</title>
<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>
<style type="text/css">
<!--
body {
text-align : center;
min-width : 770px;
margin-top: 0px;
margin-bottom: 0px;
background-image: url(Pics/border_background.jpg);
}
wrapper {
text-align : left ;
margin-left : auto ;
margin-right : auto ;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
a:active {
text-decoration: none;
}
.style1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
body,td,th {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
}
.style2 {font-size: 10px}
-->
</style></head>

<body class="wrapper" onload="MM_preloadImages('Pics/banner_01_pics/menu_01_rl.jpg','Pics/banner_01_pics/menu_02_rl.jpg','Pics/banner_01_pics/menu_03_rl.jpg','Pics/banner_01_pics/menu_04_rl.jpg','Pics/banner_01_pics/menu_05_rl.jpg')">
.
.
.
.
.
</body>
</html>

Creative Insanity
01-31-2006, 08:45 PM
First off you do not need
<link rel="shortcut icon" href="http://users.hol.gr/~lninio/favicon.ico">
or this
<link rel="icon" type="image/png" href="http://users.hol.gr/~lninio/favicon.png">
as a web browser is smart enough to pick up a favicon.ico file if the ico files is formatted correctly. If it is not then those tags would not work anyway.

All I see are a few dots which are in the center.
If you are trying to align to the center vertically then good luck as that is not an easy one and I have not found a way this can be done.

LNinio
01-31-2006, 08:48 PM
I didn't realize that i have to paste the entire site code!!! Here we are...

<!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>


<link rel="shortcut icon" href="http://users.hol.gr/~lninio/favicon.ico">
<link rel="icon" type="image/png" href="http://users.hol.gr/~lninio/favicon.png">


<meta http-equiv="Content-Type" content="text/html; charset=windows-1253" />
<title>LNinio</title>
<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>
<style type="text/css">
<!--
body {
text-align : center;
min-width : 770px;
margin-top: 0px;
margin-bottom: 0px;
background-image: url(Pics/border_background.jpg);
}
wrapper {
text-align : left ;
margin-left : auto ;
margin-right : auto ;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
a:active {
text-decoration: none;
}
.style1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
body,td,th {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
}
.style2 {font-size: 10px}
-->
</style></head>

<body class="wrapper" onload="MM_preloadImages('Pics/banner_01_pics/menu_01_rl.jpg','Pics/banner_01_pics/menu_02_rl.jpg','Pics/banner_01_pics/menu_03_rl.jpg','Pics/banner_01_pics/menu_04_rl.jpg','Pics/banner_01_pics/menu_05_rl.jpg')">




<script language="JavaScript">
dCol='000000';//date colour.
fCol='000000';//face colour.
sCol='000000';//seconds colour.
mCol='000000';//minutes colour.
hCol='000000';//hours colour.
ClockHeight=40;
ClockWidth=40;
ClockFromMouseY=0;
ClockFromMouseX=100;

//Alter nothing below! Alignments will be lost!

d=new Array("ΚΥΡΙΑΚΗ","ΔΕΥΤΕΡΑ","ΤΡΙΤΗ","ΤΕΤΑΡΤΗ","ΠΕΜΠΤΗ","ΠΑΡΑΣΚΕΥΗ","ΣΑΒΒΑΤΟ");
m=new Array("ΙΑΝΟΥΑΡΙΟΥ","ΦΕΒΡΟΥΑΡΙΟΥ","ΜΑΡΤΙΟΥ","ΑΠΡΙΛΙΟΥ","ΜΑΙΟΥ","ΙΟΥΝΙΟΥ","ΙΟΥΛΙΟΥ","ΑΥΓΟΥΣΤΟΥ","ΣΕΠΤΕΜΒΡΙΟΥ","ΟΚΤΩΒΡΙΟΥ","ΝΟΕΜΒΡΙΟΥ","ΔΕΚΕΜΒΡΙΟΥ");
date=new Date();
day=date.getDate();
year=date.getYear();
if (year < 2000) year=year+1900;
TodaysDate=" "+d[date.getDay()]+" "+day+" "+m[date.getMonth()]+" "+year;
D=TodaysDate.split('');
H='...';
H=H.split('');
M='....';
M=M.split('');
S='.....';
S=S.split('');
Face='1 2 3 4 5 6 7 8 9 10 11 12';
font='Arial';
size=1;
speed=0.6;
ns=(document.layers);
ie=(document.all);
Face=Face.split(' ');
n=Face.length;
a=size*10;
ymouse=0;
xmouse=0;
scrll=0;
props="<font face="+font+" size="+size+" color="+fCol+">";
props2="<font face="+font+" size="+size+" color="+dCol+">";
Split=360/n;
Dsplit=360/D.length;
HandHeight=ClockHeight/4.5
HandWidth=ClockWidth/4.5
HandY=-7;
HandX=-2.5;
scrll=0;
step=0.06;
currStep=0;
y=new Array();x=new Array();Y=new Array();X=new Array();
for (i=0; i < n; i++){y[i]=0;x[i]=0;Y[i]=0;X[i]=0}
Dy=new Array();Dx=new Array();DY=new Array();DX=new Array();
for (i=0; i < D.length; i++){Dy[i]=0;Dx[i]=0;DY[i]=0;DX[i]=0}
if (ns){
for (i=0; i < D.length; i++)
document.write('<layer name="nsDate'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props2+D[i]+'</font></center></layer>');
for (i=0; i < n; i++)
document.write('<layer name="nsFace'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props+Face[i]+'</font></center></layer>');
for (i=0; i < S.length; i++)
document.write('<layer name=nsSeconds'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+sCol+'><center>'+S[i]+'</center></font></layer>');
for (i=0; i < M.length; i++)
document.write('<layer name=nsMinutes'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+mCol+'><center>'+M[i]+'</center></font></layer>');
for (i=0; i < H.length; i++)
document.write('<layer name=nsHours'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+hCol+'><center>'+H[i]+'</center></font></layer>');
}
if (ie){
document.write('<div id="Od" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < D.length; i++)
document.write('<div id="ieDate" style="position:absolute;top:0px;left:0;height:'+a+';widt h:'+a+';text-align:center">'+props2+D[i]+'</font></div>');
document.write('</div></div>');
document.write('<div id="Of" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < n; i++)
document.write('<div id="ieFace" style="position:absolute;top:0px;left:0;height:'+a+';widt h:'+a+';text-align:center">'+props+Face[i]+'</font></div>');
document.write('</div></div>');
document.write('<div id="Oh" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < H.length; i++)
document.write('<div id="ieHours" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+hCol+';text-align:center;font-weight:bold">'+H[i]+'</div>');
document.write('</div></div>');
document.write('<div id="Om" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < M.length; i++)
document.write('<div id="ieMinutes" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+mCol+';text-align:center;font-weight:bold">'+M[i]+'</div>');
document.write('</div></div>')
document.write('<div id="Os" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < S.length; i++)
document.write('<div id="ieSeconds" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+sCol+';text-align:center;font-weight:bold">'+S[i]+'</div>');
document.write('</div></div>')
}
(ns)?window.captureEvents(Event.MOUSEMOVE):0;
function Mouse(evnt){
ymouse = (ns)?evnt.pageY+ClockFromMouseY-(window.pageYOffset):event.y+ClockFromMouseY;
xmouse = (ns)?evnt.pageX+ClockFromMouseX:event.x+ClockFromM ouseX;
}
(ns)?window.onMouseMove=Mouse:document.onmousemove =Mouse;
function ClockAndAssign(){
time = new Date ();
secs = time.getSeconds();
sec = -1.57 + Math.PI * secs/30;
mins = time.getMinutes();
min = -1.57 + Math.PI * mins/30;
hr = time.getHours();
hrs = -1.575 + Math.PI * hr/6+Math.PI*parseInt(time.getMinutes())/360;
if (ie){
Od.style.top=window.document.body.scrollTop;
Of.style.top=window.document.body.scrollTop;
Oh.style.top=window.document.body.scrollTop;
Om.style.top=window.document.body.scrollTop;
Os.style.top=window.document.body.scrollTop;
}
for (i=0; i < n; i++){
var F=(ns)?document.layers['nsFace'+i]:ieFace[i].style ;
F.top=y[i] + ClockHeight*Math.sin(-1.0471 + i*Split*Math.PI/180)+scrll;
F.left=x[i] + ClockWidth*Math.cos(-1.0471 + i*Split*Math.PI/180);
}
for (i=0; i < H.length; i++){
var HL=(ns)?document.layers['nsHours'+i]:ieHours[i].st yle;
HL.top=y[i]+HandY+(i*HandHeight)*Math.sin(hrs)+scr ll;
HL.left=x[i]+HandX+(i*HandWidth)*Math.cos(hrs);
}
for (i=0; i < M.length; i++){
var ML=(ns)?document.layers['nsMinutes'+i]:ieMinutes[i ].style;
ML.top=y[i]+HandY+(i*HandHeight)*Math.sin(min)+scr ll;
ML.left=x[i]+HandX+(i*HandWidth)*Math.cos(min);
}
for (i=0; i < S.length; i++){
var SL=(ns)?document.layers['nsSeconds'+i]:ieSeconds[i ].style;
SL.top=y[i]+HandY+(i*HandHeight)*Math.sin(sec)+scr ll;
SL.left=x[i]+HandX+(i*HandWidth)*Math.cos(sec);
}
for (i=0; i < D.length; i++){
var DL=(ns)?document.layers['nsDate'+i]:ieDate[i].styl e;
DL.top=Dy[i] + ClockHeight*1.5*Math.sin(currStep+i*Dsplit*Math.PI/180)+scrll;
DL.left=Dx[i] + ClockWidth*1.5*Math.cos(currStep+i*Dsplit*Math.PI/180);
}
currStep-=step;
}
function Delay(){
scrll=(ns)?window.pageYOffset:0;
Dy[0]=Math.round(DY[0]+=((ymouse)-DY[0])*speed);
Dx[0]=Math.round(DX[0]+=((xmouse)-DX[0])*speed);
for (i=1; i < D.length; i++){
Dy[i]=Math.round(DY[i]+=(Dy[i-1]-DY[i])*speed);
Dx[i]=Math.round(DX[i]+=(Dx[i-1]-DX[i])*speed);
}
y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);
x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);
for (i=1; i < n; i++){
y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed);
x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);
}
ClockAndAssign();
setTimeout('Delay()',20);
}
if (ns||ie)window.onload=Delay;
</script>





<table width="766" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="205" height="124" rowspan="3">Pics/banner_01_pics/logo.jpg</td>
<td height="34" colspan="5" align="left" background="Pics/banner_01_pics/upper_background.jpg">


<script language="Javascript">
<!--
/*
DATE SCRIPT
*/

var dayName = new Array ("Κυριακή", "Δευτέρα", "Τρίτη", "Τετάρτη", "Πέμπτη", "Παρασκευή", "Σάββατο")

var monName = new Array ("Ιανουαρίου", "Φεβρουαρίου", "Μαρτίου", "Απριλίου", "Μαίου", "Ιουνίου", "Ιουλίου", "Αυγούστου", "Σεπτεμβρίου", "Οκτωβρίου", "Νοεμβρίου", "Δεκεμβρίου")

var now = new Date

document.write(" Σήμερα είναι " + dayName[now.getDay()] + ", "+now.getDate() +" " + monName[now.getMonth()] + " 2006 ")

//-->
</script>

</td>
</tr>
<tr>
<td width="206">Pics/banner_01_pics/menu_01.jpg (#)Pics/banner_01_pics/menu_02.jpg (#)</td>
<td width="103">Pics/banner_01_pics/menu_03.jpg (#)</td>
<td width="103">Pics/banner_01_pics/menu_04.jpg (#)</td>
<td width="103">Pics/banner_01_pics/menu_05.jpg (#)</td>
<td width="46">Pics/banner_01_pics/menu_06.jpg</td>
</tr>
<tr>
<td height="51" colspan="5" background="Pics/banner_01_pics/bottom_background.jpg"></td>
</tr>
</table>
<table width="766" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="766" height="63">Pics/banner_02_pics/background.jpg</td>
</tr>
</table>
<table width="766" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="204">Pics/banner_03_pics/welcome.jpg</td>
<td width="203">Pics/banner_03_pics/middle.jpg</td>
<td height="86">Pics/banner_03_pics/right.jpg</td>
</tr>
</table>
<table width="766" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="200" height="548" align="center" valign="top" background="Pics/left_background.jpg">

</p>


</p>


Pics/support.jpg

<span class="style1">24ωρη τεχνική υποστήριξη </span></p>


</p>


Pics/customers_banner.jpg



<span class="style1">Χατζηευστρατίου</span>

<span class="style1">Ο.Σ.Φ.Π.</span>

<span class="style1">Νταντάμης</span></p>


</p>


Pics/goonline.gif (http://www.go-online.gr/index.html)</p></td>
<td align="left" valign="top" bgcolor="#FFFFFF"><table width="100%" border="0" cellspacing="5" cellpadding="10">
<tr>
<td><p class="style1">Προσχέδιο του δικού μας site.

Δεν λειτουργεί κανένα link. </p>
<p class="style1"></p></td>
</tr>
</table></td>
<td width="22" height="548">Pics/right_background.jpg</td>
</tr>
</table>
<table width="766" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>Pics/bottom_banner/bottom_banner.jpg
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="left" bgcolor="#FFFFFF" class="style2"><script>

/*Displaying a user's browser type script*/

if (document.all)
var version=/MSIE \d+.\d+/

if (!document.all)
document.write("You are using "+navigator.appName+" "+navigator.userAgent)
else
document.write("You are using "+navigator.appName+" "+navigator.appVersion.match(version))

</script>
</td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>

gmcrone
02-01-2006, 08:37 AM
Don't make your body the wrapper
Take the class wrapper out of body
go down one line and enter <div class=wrapper>
Then at the end of your code just before /body add </div>

Mike...

LNinio
02-01-2006, 10:54 AM
What i do wrong again? I did what you say but still the site is stuck on the left!!!
<!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>


<link rel="shortcut icon" href="http://users.hol.gr/~lninio/favicon.ico">
<link rel="icon" type="image/png" href="http://users.hol.gr/~lninio/favicon.png">


<meta http-equiv="Content-Type" content="text/html; charset=windows-1253" />
<title>Con-Net</title>
<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>
<style type="text/css">
<!--
body {
text-align : center;
min-width : 770px;
margin-top: 0px;
margin-bottom: 0px;
background-image: url(Pics/border_background.jpg);
}
div.wrapper {
text-align : left ;
margin-left : auto ;
margin-right : auto ;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
a:active {
text-decoration: none;
}
.style1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
body,td,th {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
}
.style2 {font-size: 10px}
-->
</style></head>

<body onload="MM_preloadImages('Pics/banner_01_pics/menu_01_rl.jpg','Pics/banner_01_pics/menu_02_rl.jpg','Pics/banner_01_pics/menu_03_rl.jpg','Pics/banner_01_pics/menu_04_rl.jpg','Pics/banner_01_pics/menu_05_rl.jpg')">
<div class="wrapper">


<script language="JavaScript">
dCol='000000';//date colour.
fCol='000000';//face colour.
sCol='000000';//seconds colour.
mCol='000000';//minutes colour.
hCol='000000';//hours colour.
ClockHeight=40;
ClockWidth=40;
ClockFromMouseY=0;
ClockFromMouseX=100;

//Alter nothing below! Alignments will be lost!

d=new Array("ΚΥΡΙΑΚΗ","ΔΕΥΤΕΡΑ","ΤΡΙΤΗ","ΤΕΤΑΡΤΗ","ΠΕΜΠΤΗ","ΠΑΡΑΣΚΕΥΗ","ΣΑΒΒΑΤΟ");
m=new Array("ΙΑΝΟΥΑΡΙΟΥ","ΦΕΒΡΟΥΑΡΙΟΥ","ΜΑΡΤΙΟΥ","ΑΠΡΙΛΙΟΥ","ΜΑΙΟΥ","ΙΟΥΝΙΟΥ","ΙΟΥΛΙΟΥ","ΑΥΓΟΥΣΤΟΥ","ΣΕΠΤΕΜΒΡΙΟΥ","ΟΚΤΩΒΡΙΟΥ","ΝΟΕΜΒΡΙΟΥ","ΔΕΚΕΜΒΡΙΟΥ");
date=new Date();
day=date.getDate();
year=date.getYear();
if (year < 2000) year=year+1900;
TodaysDate=" "+d[date.getDay()]+" "+day+" "+m[date.getMonth()]+" "+year;
D=TodaysDate.split('');
H='...';
H=H.split('');
M='....';
M=M.split('');
S='.....';
S=S.split('');
Face='1 2 3 4 5 6 7 8 9 10 11 12';
font='Arial';
size=1;
speed=0.6;
ns=(document.layers);
ie=(document.all);
Face=Face.split(' ');
n=Face.length;
a=size*10;
ymouse=0;
xmouse=0;
scrll=0;
props="<font face="+font+" size="+size+" color="+fCol+">";
props2="<font face="+font+" size="+size+" color="+dCol+">";
Split=360/n;
Dsplit=360/D.length;
HandHeight=ClockHeight/4.5
HandWidth=ClockWidth/4.5
HandY=-7;
HandX=-2.5;
scrll=0;
step=0.06;
currStep=0;
y=new Array();x=new Array();Y=new Array();X=new Array();
for (i=0; i < n; i++){y[i]=0;x[i]=0;Y[i]=0;X[i]=0}
Dy=new Array();Dx=new Array();DY=new Array();DX=new Array();
for (i=0; i < D.length; i++){Dy[i]=0;Dx[i]=0;DY[i]=0;DX[i]=0}
if (ns){
for (i=0; i < D.length; i++)
document.write('<layer name="nsDate'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props2+D[i]+'</font></center></layer>');
for (i=0; i < n; i++)
document.write('<layer name="nsFace'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props+Face[i]+'</font></center></layer>');
for (i=0; i < S.length; i++)
document.write('<layer name=nsSeconds'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+sCol+'><center>'+S[i]+'</center></font></layer>');
for (i=0; i < M.length; i++)
document.write('<layer name=nsMinutes'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+mCol+'><center>'+M[i]+'</center></font></layer>');
for (i=0; i < H.length; i++)
document.write('<layer name=nsHours'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+hCol+'><center>'+H[i]+'</center></font></layer>');
}
if (ie){
document.write('<div id="Od" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < D.length; i++)
document.write('<div id="ieDate" style="position:absolute;top:0px;left:0;height:'+a+';widt h:'+a+';text-align:center">'+props2+D[i]+'</font></div>');
document.write('</div></div>');
document.write('<div id="Of" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < n; i++)
document.write('<div id="ieFace" style="position:absolute;top:0px;left:0;height:'+a+';widt h:'+a+';text-align:center">'+props+Face[i]+'</font></div>');
document.write('</div></div>');
document.write('<div id="Oh" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < H.length; i++)
document.write('<div id="ieHours" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+hCol+';text-align:center;font-weight:bold">'+H[i]+'</div>');
document.write('</div></div>');
document.write('<div id="Om" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < M.length; i++)
document.write('<div id="ieMinutes" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+mCol+';text-align:center;font-weight:bold">'+M[i]+'</div>');
document.write('</div></div>')
document.write('<div id="Os" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < S.length; i++)
document.write('<div id="ieSeconds" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+sCol+';text-align:center;font-weight:bold">'+S[i]+'</div>');
document.write('</div></div>')
}
(ns)?window.captureEvents(Event.MOUSEMOVE):0;
function Mouse(evnt){
ymouse = (ns)?evnt.pageY+ClockFromMouseY-(window.pageYOffset):event.y+ClockFromMouseY;
xmouse = (ns)?evnt.pageX+ClockFromMouseX:event.x+ClockFromM ouseX;
}
(ns)?window.onMouseMove=Mouse:document.onmousemove =Mouse;
function ClockAndAssign(){
time = new Date ();
secs = time.getSeconds();
sec = -1.57 + Math.PI * secs/30;
mins = time.getMinutes();
min = -1.57 + Math.PI * mins/30;
hr = time.getHours();
hrs = -1.575 + Math.PI * hr/6+Math.PI*parseInt(time.getMinutes())/360;
if (ie){
Od.style.top=window.document.body.scrollTop;
Of.style.top=window.document.body.scrollTop;
Oh.style.top=window.document.body.scrollTop;
Om.style.top=window.document.body.scrollTop;
Os.style.top=window.document.body.scrollTop;
}
for (i=0; i < n; i++){
var F=(ns)?document.layers['nsFace'+i]:ieFace[i].style ;
F.top=y[i] + ClockHeight*Math.sin(-1.0471 + i*Split*Math.PI/180)+scrll;
F.left=x[i] + ClockWidth*Math.cos(-1.0471 + i*Split*Math.PI/180);
}
for (i=0; i < H.length; i++){
var HL=(ns)?document.layers['nsHours'+i]:ieHours[i].st yle;
HL.top=y[i]+HandY+(i*HandHeight)*Math.sin(hrs)+scr ll;
HL.left=x[i]+HandX+(i*HandWidth)*Math.cos(hrs);
}
for (i=0; i < M.length; i++){
var ML=(ns)?document.layers['nsMinutes'+i]:ieMinutes[i ].style;
ML.top=y[i]+HandY+(i*HandHeight)*Math.sin(min)+scr ll;
ML.left=x[i]+HandX+(i*HandWidth)*Math.cos(min);
}
for (i=0; i < S.length; i++){
var SL=(ns)?document.layers['nsSeconds'+i]:ieSeconds[i ].style;
SL.top=y[i]+HandY+(i*HandHeight)*Math.sin(sec)+scr ll;
SL.left=x[i]+HandX+(i*HandWidth)*Math.cos(sec);
}
for (i=0; i < D.length; i++){
var DL=(ns)?document.layers['nsDate'+i]:ieDate[i].styl e;
DL.top=Dy[i] + ClockHeight*1.5*Math.sin(currStep+i*Dsplit*Math.PI/180)+scrll;
DL.left=Dx[i] + ClockWidth*1.5*Math.cos(currStep+i*Dsplit*Math.PI/180);
}
currStep-=step;
}
function Delay(){
scrll=(ns)?window.pageYOffset:0;
Dy[0]=Math.round(DY[0]+=((ymouse)-DY[0])*speed);
Dx[0]=Math.round(DX[0]+=((xmouse)-DX[0])*speed);
for (i=1; i < D.length; i++){
Dy[i]=Math.round(DY[i]+=(Dy[i-1]-DY[i])*speed);
Dx[i]=Math.round(DX[i]+=(Dx[i-1]-DX[i])*speed);
}
y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);
x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);
for (i=1; i < n; i++){
y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed);
x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);
}
ClockAndAssign();
setTimeout('Delay()',20);
}
if (ns||ie)window.onload=Delay;
</script>





<table width="766" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="205" height="124" rowspan="3">Pics/banner_01_pics/logo.jpg</td>
<td height="34" colspan="5" align="left" background="Pics/banner_01_pics/upper_background.jpg">


<script language="Javascript">
<!--
/*
DATE SCRIPT
*/

var dayName = new Array ("Κυριακή", "Δευτέρα", "Τρίτη", "Τετάρτη", "Πέμπτη", "Παρασκευή", "Σάββατο")

var monName = new Array ("Ιανουαρίου", "Φεβρουαρίου", "Μαρτίου", "Απριλίου", "Μαίου", "Ιουνίου", "Ιουλίου", "Αυγούστου", "Σεπτεμβρίου", "Οκτωβρίου", "Νοεμβρίου", "Δεκεμβρίου")

var now = new Date

document.write(" Σήμερα είναι " + dayName[now.getDay()] + ", "+now.getDate() +" " + monName[now.getMonth()] + " 2006 ")

//-->
</script>

</td>
</tr>
<tr>
<td width="206">Pics/banner_01_pics/menu_01.jpg (#)Pics/banner_01_pics/menu_02.jpg (#)</td>
<td width="103">Pics/banner_01_pics/menu_03.jpg (#)</td>
<td width="103">Pics/banner_01_pics/menu_04.jpg (#)</td>
<td width="103">Pics/banner_01_pics/menu_05.jpg (#)</td>
<td width="46">Pics/banner_01_pics/menu_06.jpg</td>
</tr>
<tr>
<td height="51" colspan="5" background="Pics/banner_01_pics/bottom_background.jpg"></td>
</tr>
</table>
<table width="766" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="766" height="63">Pics/banner_02_pics/background.jpg</td>
</tr>
</table>
<table width="766" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="204">Pics/banner_03_pics/welcome.jpg</td>
<td width="203">Pics/banner_03_pics/middle.jpg</td>
<td height="86">Pics/banner_03_pics/right.jpg</td>
</tr>
</table>
<table width="766" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="200" height="548" align="center" valign="top" background="Pics/left_background.jpg">

</p>


</p>


Pics/support.jpg

<span class="style1">24ωρη τεχνική υποστήριξη </span></p>


</p>


Pics/customers_banner.jpg



<span class="style1">Χατζηευστρατίου</span>

<span class="style1">Ο.Σ.Φ.Π.</span>

<span class="style1">Νταντάμης</span></p>


</p>


Pics/goonline.gif (http://www.go-online.gr/index.html)</p></td>
<td align="left" valign="top" bgcolor="#FFFFFF"><table width="100%" border="0" cellspacing="5" cellpadding="10">
<tr>
<td><p class="style1"></p>
<p class="style1"></p></td>
</tr>
</table></td>
<td width="22" height="548">Pics/right_background.jpg</td>
</tr>
</table>
<table width="766" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="199" height="79">Pics/bottom_banner/bottom_banner_l.jpg</td>
<td width="444" height="79">Pics/bottom_banner/bottom_banner_m.jpg</td>
<td width="123" height="79">Pics/bottom_banner/bottom_banner_r.jpg</td>
</tr>
</table>
<table width="766" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="left" bgcolor="#FFFFFF" class="style2"><script>

/*Displaying a user's browser type script*/

if (document.all)
var version=/MSIE \d+.\d+/

if (!document.all)
document.write("You are using "+navigator.appName+" "+navigator.userAgent)
else
document.write("You are using "+navigator.appName+" "+navigator.appVersion.match(version))

</script>
</td>
</tr>
</table></td>
</tr>
</table>

<map name="Map" id="Map"><area shape="rect" coords="112,45,146,70" href="http://www.microsoft.com/windows/ie/default.mspx" target="_blank" />
</map>
<map name="Map2" id="Map2"><area shape="rect" coords="274,57,339,71" href="disclaimer.html" />
</map>
</div>
</body>
</html>