PDA

View Full Version : Web Browsers


triplemoons
02-28-2006, 03:48 AM
Didn't really know where else to put this. I did post this on Macromedia's help forum, but I didn't get a whole lot of assistance.

www.triplemoonsexotic.com

The above link is how far I got.

Basically, what I need is for my design to center automatically on any browser size. I have decreased the width to 750 pixels to allow for those useing 800. I have it centering ok now via Dreamweaver. However, the image seen is a single image without my text or menus. I usually put those in after pulling my design from Fireworks in, useing the "Draw Layer" option. It has come to my attention, that by doing this with the center function, my layers do not stay where they should on the design.

I do not use CSS and I have extremely limited HTML knowledge.

Any help would be much appreciated! :D

This is the current code ---

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-color: #FFFFCC;
}
body,td,th {
font-size: 100%;
font-family: Century Gothic;
color: #000000;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
a:active {
text-decoration: none;
}
-->
</style>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>
</head>
<body>
<table width="49%" height="1000" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="89%">http://www.triplemoonsexotic.com/media/index.gif</td>
</tr>
</table>
</body>
</html>

triplemoons
02-28-2006, 04:03 AM
Ok, I think I might have figured out EXACTLY what I need to do by searching on this wonderful forum. :)

http://www.dreamweaverclub.com/css-center-content.php

HOWEVER, how do I make the CSS file? Or is this CSS supposed to be in the script somewhere?

gmcrone
02-28-2006, 05:04 AM
A CSS file is a pure text file. Just create it with notepad or similar and save it as "filename.css", then link to it in your web page.

Mike...

triplemoons
02-28-2006, 05:10 AM
Ok, so I link it to my page by useing Design/CSS Styles window, correct?

Do I just have to take the code from the link, put it into a word file (with the css extension) and then put it into my file?

triplemoons
02-28-2006, 05:17 AM
I tried making a CSS file, and it give me an error that it's a binery file and I need to select a text file. :?:

domedia
02-28-2006, 02:19 PM
Actually, DW has good support for CSS now.
Hit F1 and read how to make a CSS file through DW :)

triplemoons
02-28-2006, 05:05 PM
I need someone to walk me through this. I don't do CSS. I need these questions answered...

Ok, so I link it to my page by useing Design/CSS Styles window, correct?

Do I just have to take the code from the link, put it into a word file (with the css extension) and then put it into my file?

Creative Insanity
02-28-2006, 05:28 PM
Not word.. msword docs add junk to the file and you don't want that.. use notepad or such like.

triplemoons
02-28-2006, 05:33 PM
I meant WordPad.

I still have no idea what I'm doing. I copy and pasted this:

body {
text-align : center ;
min-width : 750px ;
}
div.wrapper {
text-align : left ;
margin-left : auto ;
margin-right : auto ;
}

Into a Dreamweaver CSS file. Saved it. Used the design panel to assign it to my page, and it does NOTHING.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>
<link href="/center.css" rel="stylesheet" type="text/css">
<style type="text/css">
<!--
body,td,th {
font-family: Century Gothic;
}
body {
background-color: #FFFFCC;
}
a:link {
color: #330033;
}
a:visited {
color: #330033;
}
a:hover {
color: #FF3399;
}
a:active {
color: #330033;
}
-->
</style></head>
<body>
http://www.triplemoonsexotic.com/media/index.gif
</body>
</html>

domedia
02-28-2006, 06:01 PM
You have no wrapper in your HTML code.
Look at this page and look at the HTML code given :)
http://www.dreamweaverclub.com/css-center-content.php

triplemoons
02-28-2006, 06:09 PM
I noticed that...

I had put the wrapper thing where I thought it would go...

</style></head>
<body>
<div class="wrapper">
http://www.triplemoonsexotic.com/media/index.gif</div>
</body>
</html>

and it still didn't work.

http://www.triplemoonsexotic.com/test.html

domedia
02-28-2006, 06:49 PM
Use this:
body { text-align: center; }
div.wrapper {
width: 750px;
text-align: left;
margin-left: auto;
margin-right: auto;
}

Mike, we might have to change your tutorial code?

triplemoons
02-28-2006, 11:12 PM
Neat-o! :D

You have just made my day! I thought I was going crazy!

http://www.triplemoonsexotic.com/test.html

Next question...If I use layers in the file (between the "wrapper" code), will they stay where I want them to?

triplemoons
02-28-2006, 11:14 PM
O! Another question...Can I get the top and bottom margins to be zero?

Thank you SO much!

triplemoons
03-01-2006, 03:40 AM
I did a bit of playing around...and useing the DIV tags does not work to insert my text/graphics on top of my main design...

So, any answers as to how???

I tried this...

</style>
<link href="/center.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="wrapper">
<div id="copyright" style="position:absolute;left:74px;top:936px;border:0px; width:627px; height:24px;">


All content &copy; Triple Moons Exotic - Web Design by Triple Moons Design (http://www.triplemoonsexotic.com) </p>
</div>
<div class="wrapper">
http://www.triplemoonsexotic.com/media/750x1000.gif</div>
</body>

But it didn't work. :(

triplemoons
03-01-2006, 04:03 AM
Nevermind!

I found this thread...
http://www.dreamweaverclub.com/forum/viewtopic.php?t=2086&highlight=centering+layers+css

I need to switch my layers to 100% width and height!

:D