In dreamweaver how do you enable your site to automatically center itself, or how do i center it i guess is the question. It is centered on one resolution and the rest it is a bit off center. my site is www.kurtdenison.com so you can see what i mean. Help! thanks guys.
Got a tip for us?
Let us know
Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.
Center your Site.
- Thread starter 6914708
- Start date
- Sort by reaction score
You have a 3 column layout but you aren't using the first or third column. Heres an html based way to center your site and I took out the two unnecessary columns.
<table width="689" border="0" cellpadding="0" cellspacing="0" align="center">
<tr>
<td> </td>
</tr>
<tr>
<td valign="top"><img src="/indextopheader.gif" width="689" height="19"></td>
</tr>
<tr>
<td valign="top"><a href="home.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image2','','/indeximage3.jpg',1)"><img src="/indeximage2.jpg" name="Image2" width="689" height="401" border="0"></a></td>
</tr>
<tr>
<td valign="top"><img src="/bottomheader.gif" width="689" height="19"></td>
</tr>
<tr>
<td valign="top"><div align="center">
<p><img src="/indexdescription.gif" width="689" height="87"></p>
</div></td>
</tr>
<tr>
<td> </td>
</tr>
</table>
You could also clean this up a bit, but baby steps
<table width="689" border="0" cellpadding="0" cellspacing="0" align="center">
<tr>
<td> </td>
</tr>
<tr>
<td valign="top"><img src="/indextopheader.gif" width="689" height="19"></td>
</tr>
<tr>
<td valign="top"><a href="home.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image2','','/indeximage3.jpg',1)"><img src="/indeximage2.jpg" name="Image2" width="689" height="401" border="0"></a></td>
</tr>
<tr>
<td valign="top"><img src="/bottomheader.gif" width="689" height="19"></td>
</tr>
<tr>
<td valign="top"><div align="center">
<p><img src="/indexdescription.gif" width="689" height="87"></p>
</div></td>
</tr>
<tr>
<td> </td>
</tr>
</table>
You could also clean this up a bit, but baby steps
Are you using any css? If so, maybe something like...
body {text-align: center;}
??
Maybe not. I'm a total n00b at web-stuff, so a lot of what I do is trial and error.
edit: I just looked at your code and noticed you used tables. Rower's not gonna like that.... *runs for cover*
body {text-align: center;}
??
Maybe not. I'm a total n00b at web-stuff, so a lot of what I do is trial and error.
edit: I just looked at your code and noticed you used tables. Rower's not gonna like that.... *runs for cover*
Heh...baby steps, Brian, baby steps.
Have you tried using the properties panel and clicking on the table border to select the whole thing and then clicking on the center alignment button?
You really should learn some HTML, though, because adding the code to center a table is pretty trivial.
Have you tried using the properties panel and clicking on the table border to select the whole thing and then clicking on the center alignment button?
You really should learn some HTML, though, because adding the code to center a table is pretty trivial.
Yeah, I was... uh... just... uh... kidding about that. Yeah, I was just joking around - you know me.
*tugs at collar*
Is it warm in here???
*tugs at collar*
Is it warm in here???
simple Dreamweaver trick.
In Dreamweaver, go to HTML source,
copy and paste teh code below,
Then you can still edit in "Layout" mode.
BASIC IDEA OF THE CENTERING CONTENT: (if you were to do this from scratch)
1 CREATE MOTHER TABLE
In Dreamweaver, create table with 100% width and 100% Height with a cell that has also 100% width and height, but with align center and valign center.Sometimes you can't assign height of the table so go to code and paste
height="100%"
right next to
width="100%"
2
Inside of that cell you insert another table that is purely your content. in this case the blue header to the blur footer but not all the grey area around it. don't forget the DOCTYPE stuff on top of the page (for Safari Browser especially) 100% woudl not work vertically if you forget.
good luck.
----------
In Dreamweaver, go to HTML source,
copy and paste teh code below,
Then you can still edit in "Layout" mode.
BASIC IDEA OF THE CENTERING CONTENT: (if you were to do this from scratch)
1 CREATE MOTHER TABLE
In Dreamweaver, create table with 100% width and 100% Height with a cell that has also 100% width and height, but with align center and valign center.Sometimes you can't assign height of the table so go to code and paste
height="100%"
right next to
width="100%"
2
Inside of that cell you insert another table that is purely your content. in this case the blue header to the blur footer but not all the grey area around it. don't forget the DOCTYPE stuff on top of the page (for Safari Browser especially) 100% woudl not work vertically if you forget.
good luck.
----------
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Kurt Denison</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
background-color: #E5E5E5;
}
-->
</style>
<script language="JavaScript" type="text/JavaScript">
<!--
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_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_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('illustratorbutton2.gif','/indeximage3.jpg')">
<table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%">
<tr>
<td valign="middle" align="center" height="100%" width="100%">
<table border="0" cellpadding="0" cellspacing="0">
<!--DWLayoutDefaultTable-->
<tr>
<td valign="top"><img src="/indextopheader.gif" width="689" height="19"></td>
</tr>
<tr>
<td valign="top"><a href="home.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image2','','/indeximage3.jpg',1)"><img src="/indeximage2.jpg" name="Image2" width="689" height="401" border="0"></a></td>
</tr>
<tr>
<td valign="top"><img src="/bottomheader.gif" width="689" height="19"></td>
</tr>
<tr>
<td valign="top"><img src="/indexdescription.gif" width="689" height="87"></td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
You can't select the entire site. You'll have to fix it one page at a time. Use Edit--Select All to select an entire page.
It looks like your design skills are WAY ahead of your basic HTML skills. You should probably bone up on basic HTML. Maybe get a basic book like HTML For Dummies. Once you have a better understanding of HTML, you'll have an easier time getting Dreamweaver to do what you want.
It looks like your design skills are WAY ahead of your basic HTML skills. You should probably bone up on basic HTML. Maybe get a basic book like HTML For Dummies. Once you have a better understanding of HTML, you'll have an easier time getting Dreamweaver to do what you want.
THANKS!
hey you guys, thank you so much for all the info, your the best. I think i figured it out. www.kurtdenison.com Thanks!
hey you guys, thank you so much for all the info, your the best. I think i figured it out. www.kurtdenison.com Thanks!
it works, sort of. if I make it wider, it stays centered. if I shrink it down, then it keeps the left margin, but cuts off the right side.