How do I center a container div tag in Dreamweaver?

Hi,
I actually asked this question about another web page but for some reason setting the margins to "auto" on this one isn't working.
Please help. Thank you.
http://www.laurasummers.com/

Thanks Nancy. I appreciate this. I do have another question, though. I did try to adjust the margins in my Dreamweaver body style sheet and it didn't seem to work. Do you know why this is?
Also, I did add this code. It worked except that the "Laura Lee Summers" and the subtle wave imagery stay in place while everything else centers. The Laura Lee Summer and the wave image is in the container div tag so I am confused.
Try this:
body {
width: 960px;
position: relative;
margin: 0 auto; /**this centers the page on screen**/
background: #cdffff url(lsummers_images/laurasummers_bkgd_Final.jpg) top center no-repeat;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
font-size: 14px;
color: #111;
line-height: 1.5;
NOTE #1: font-size in points (pt) is for print only. For web pages displayed on screens, use px, ems or %.
NOTE #2: The site owner's name is the most important piece of information on the page, right? It belongs inside the markup within <h1> tags. Instead, you have put her name in a background image which will never be recognized by Google.
SEO LINKS
Google's SEO Starter Guide Updated 2010
http://googlewebmastercentral.blogspot.com/2010/09/seo-starter-guide-updated.html
High Rankings Advisor
http://www.highrankings.com/newsletter/
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

Similar Messages

What must i do to get Insert Fluid Grid Layout Div Tag on dreamweaver?

Why an i not able to get the Insert Fluid Grid Layout Div Tag on dreamweaver?
I am using Creative Cloud

Hi Leroy, this post in the Adobe Dreamweaver Team Blog may assist you with the updates to Dreamweaver: http://blogs.adobe.com/dreamweaver/2013/02/updated-fluid-grids-in-dreamweaver.html
Let me know if you still require assistance.

How do I center an image inside a CSS div tag using dreamweaver?

I know this may seem like a very silly queston to ask because it should seem so simple but how do I do that? I am having trouble being able to center an image inside of a div tag. Here is the code I have come up with so far. Thanks in advance for your help.
</style>
</head>
<body>
<div id="PageContainer">
<div id="PageHeader"> img.centered{display:block; margin-left:auto; margin-right:auto; }<img src="Untitled-5.jpg" alt="rowland" class="centered" /></div>
<div id="PageMenu">Content for id "PageHeader" Goes Here</div>
<div id="PageBody">Content for id "PageHeader" Goes Here</div>
<div id="PageFooter">Content for id "PageHeader" Goes Here</div>
</body>
</html>
Also you can ignore the other div tags after the first div id. The first div id that has my image link is the one I am trying to get to center my image. The image is in there just not centering.

Centering Pages, Images and other elements with CSS:
http://cookbooks.adobe.com/post_Centering_web_pages_and_other_elements_with_CSS-16640.html
Nancy O.

How to start your container div tag at the very top of the page?

I'm currently making a website for a friend and I can't seem to get my web page to start at the very top of the browser window. It seems like when you create a website in dreamweaver it want's to start it with a gap at the top. How do I take the top gap out?

Best if you upload the page you're working on to the web and post a link here so we can see what you're doing.
Try adding
body {
margin: 0;
padding: 0;
to your CSS stylesheet.

How do I hide an ap div tag or layer in order to access the table or image under it?

Since Dreamweaver CC 2014 has gotten rid of the layers features I can't find out how to 'hide' my existing layers made in an older version in order to select the images or tables under it. I'm not a professional web designer, I just do this for my own business' websites and can't afford to redesign the whole thing at the moment but I need to edit a few things. Basically, I want to extend the page by replacing the short band of dark green with a larger one, and add more text to the FAQ. If I really need to I guess I can add a link for an additional page but I'm trying to avoid that. This is the page I am trying to edit, if it helps: Fancy Fairy Wings Frequently Asked Questions

APDivs are contra-indicated in modern web design. But.... you can turn off CSS in DW's Design View.
Go to View > Style Rendering > un-tick Display Styles.
This will disable styles while you work but it won't effect Live View or Preview in browsers.
The alternative is to stay away from positioning and table layouts. Learn to use modern web design methods:
CSS Box Model
CSS Margins
CSS Floats
CSS Padding
CSS Borders
If you're not learning new stuff, you're falling hopelessly behind the curve. That's not good for a business. Just saying...
Nancy O.

How does one center a html div to the stage (already centered) ?

I added a HTML form to my edge project.
It is visible in preview, but takes up the whole time line, also I can't center its position.
I only need it in certain frames.
My stage is centered, already and overflow is visible by design.
I tried to do it in dreamweaver (where these were built), no luck. I have several html forms to embed in my project
and I'm avoiding rebuilding each one. Help is needed...
Thanks
Henry the begginer

On the elements you want to center try this:
.css({margin: "0px auto", position: "relative", left: "0px" });

Help with placement of div tags

Hello. I am sorry to ask what probably is a dumb question, but I'm new, using Dreamweaver CS5, and I need some help. I'm sure I'll be posting here a few times during this process of building a new site, but I'm hoping it can be a good way for me to learn. I've watched a lot of tutorial videos, and so here I am.
I have my site, but I'm having problems being able to place div tags. I set it up with a wrapper div, a header div, a content div, footer div, etc. But, inside those divs I want to have other div's where I can place things like a client login box, etc. So, I tried and tried to place them after one div, or before one, but I just can't get them to work right. I'm very proficient at Photoshop, but web work is fairly new. I've done a few sites, but in Golive and just basic bringing them in from Photoshop. Now I want to learn correctly, so I'm trying all of this.
I found a way to make a box, using AP Div tag, and then move that where I want it, but, it doesn't work right for me then. I don't want it fixed in the same spot absolutely, but rather I want it to move with the page. I'm going to post a link to the site I'm working on, in case that helps. But, if you look at the site so far, you can see for example I want the text box that says client login to move as you make the page wider or smaller. It's fixed now. But, it's the only possible way I know how to put the box and div tag where I want it. When I just try to insert a div tag (not an AP div) it just goes underneath the div above it.
What I'm asking is, how do I place div's within div's? Or, can I use this AP div to put it where I want, and then change it to a regular div, and it stay in the right spot? I just don't understand how exactly to place divs where I want them, unless I use the AP div box and move it around the screen. Also, if I have a div box setup, is there a way to drag it somewhere else or reposition it somewhere else on the screen just by dragging? It's all a bit hard for me to figure out at this point, but I appreciate any help you can give me.
The AP Div I used is at the top that says client login. That's the box/table/div tag I'm trying to set up correctly, so it moves with the other elements, like the logo, as you make the page wider or less wide.
Here is the link:
http://www.gagephotography.com/boudoir/boudoirsite/index4.html
Thank you again.

DW is not drag & drop friendly like graphics or word processing apps.
APDivs are NOT for primary layouts. They are for special situations and should be handled with care or you'll end up with a mess. Here is why:
http://apptools.com/examples/pagelayout101.php
The best advice I can offer is to familiarize yourself with HTML markup (content) and CSS (styles) before you even open Dreamweaver. Without a working knowledge of code, you're not going to get good results.
Start here:
HTML & CSS Tutorials - http://w3schools.com/
Learn CSS positioning in 10 Steps
http://www.barelyfitz.com/screencast/html-training/css/positioning/
How to Develop with CSS?
http://phrogz.net/css/HowToDevelopWithCSS.html
New DW Starter Pages --
http://www.adobe.com/devnet/dreamweaver/articles/introducing_new_css_layouts.html
Creating your first web site in DW CS5 -
http://www.adobe.com/devnet/dreamweaver/articles/first_website_pt1.html
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

Difference Between Insertions for Div Tags

Hi,
What is the difference between "after tag" or "after the start of tag" when inserting a div tag?
Is one included in the same "container" (div tag) and the other one just "follows" after the previous div tag?
Thanks,
njdesigner1944

"after tag" inserts your div after the closing tag of the choosen div. The "after start tag" inserts the new div after the right after the tag you choose and before the close tags.
ie.
Lets say you want to insert a new div called #container with a #mainWrap div already on the page.
"after tag"
<div id="mainWrap"></div>
<div id="container"></div>
as you see it inserts after the closing div tag of #mainWrap
"after start of tag"
<div id="mainWrap"><div id="container"></div></div>
as you see it inserts #container after the start tag and before the close tag of # mainWrap

Problem to place Div tags

I am developing a web site using div tags under Dreamweaver.
Until now, I succeeded to place the different blocks using
CSS rules.
One of the block has an automatic height definition;
sometimes it can be 100 pixels high, the other time 200 pixels
high.
I need to add a block that will come immediately below the
previous one.
So sometimes it may be placed from 100 to 150 pixels,
sometime it may be placed from 200 to 250 pixels.
I don't know how to define the position of this block :
absolute, relative? I tried different solutions; I do not succeed
to make the block comming immediately after the previous.
Should someone help me?
Thanks a lot.

> I don't understand what does 'normal flow' mean.
Google it, and read about it. It's the process by which the
browser renders
the page from the top of the code to the bottom and places
page elements as
they encounter them.
> The first div
> tag has the following parameters :
> position: absolute;
You will not get anything to float under this div, since
absolute positioned
elements are removed fromt the normal flow, meaning that they
are placed on
the page in that location without regard for what else might
be immediately
before or immediately after it in the code.
This is why best practice is to not use layers for page
layout.
In your case, if you REMOVE the absolute positioning, you
will get exactly
what you want, e.g.,
<style type="text/css">

</style>
You'll also need to change this -
<div class="test">
<html xmlns="
http://www.w3.org/1999/xhtml">
to this -
<html xmlns="
http://www.w3.org/1999/xhtml">
and this -
</html>
</div>
to this -
</html>
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"Annie Benech" <[email protected]> wrote in
message
news:[email protected]...
> Thanks for your answer.
> I don't understand what does 'normal flow' mean.
> Joined, you will find a small program reproducing the
problem. The first
> div
> tag has the following parameters :
> position: absolute;
> height: auto;
> width: 100px;
> left: 10px;
> top: 10px;
> What must the parameters of the second div tag be to
float after the first
> one? Which menu of Dreamweaver should I use to define
those parameters.
> Thanks again for your help.
> Regards.
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN"
> "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
> <div class="test">
> <html xmlns="
http://www.w3.org/1999/xhtml">
> <head>
> <meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1"
> />
> 
> <title>Document sans titre</title>
> 
>  
> <style type="text/css">
> 
> </style>
> </head>
>
> <body>
> <div class="test">Placez ici le contenu de class
"test"Placez ici le
> contenu de class "test"Placez ici le contenu de class
"test"</div>
> <div class="test1">Placez ici le contenu de class
"test1"</div>
> </body>
> </html>
> </div>
>

How do I insert a photoshop photo gallery into a div tag/container?

How do I insert a photoshop photo gallery into a div
tag/container?

What pray tell is a "div tag/container"?
Walt
"mediastream13" <[email protected]> wrote in
message
news:ftmhgn$gdm$[email protected]..
> How do I insert a photoshop photo gallery into a div
tag/container?

How to center 6 divs in a container div - horizontally

I'm trying to build a Fluid Grid website with DW CC.
For now I have a problem which I can't solve.
I have six links in a nav bar. Every link has different block sizes, so I arranged that with CSS.
Now I like to have those divs, which are in a container div, horizontally centered in that container div.
The link-divs are now left aligned, the text in each div is centered.
I show you the HTML part of the links and the CSS for the navigation.

<div class="nav_container">
<div class="block1"><a href="index.html">Home</a></div>
<div class="block2"><a href="http://www.travelingphototeam.com">TravelingPhotoTeam</a></div>
<div class="block3"><a href="#">Over Ons</a></div>
<div class="block4"><a href="#">Bijbel Open</a></div>
<div class="block5"><a href="#">Nostalgie</a></div>
<div class="block6"><a href="#">Contact</a></div>
</div>
.nav_container {
          display: inline-block;
          position: relative;
          width: 100%;
          text-align: center;
.nav_container a:hover,a:active, a:focus, a.thispage    {
          color: #DCDCDC;
          text-decoration: none;
          text-align: center;
.block1 {
          width: 60px;
          float: left;
.block2 {
          width: 150px;
          float: left;
.block3 {
          width: 85px;
          float: left;
.block4 {
          width: 90px;
          float: left;
.block5 {
          width: 80px;
          float: left;
.block6 {
          width: 80px;
          float: left;

You would add up all of the block widths which comes to 545px then wrap the blocks in a blockWrapper <div> and set its width: 545px; and margin: 0 auto; which will center the blocks horizontally (see full code below)
On another note it doesn't seem like a very fluid design if you're using fixed width px.
<!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=UTF-8">
<title>Untitled Document</title>
<style>
.nav_container {
display: inline-block;
position: relative;
width: 100%;
text-align: center;
.nav_container a:hover,a:active, a:focus, a.thispage    {
color: #DCDCDC;
text-decoration: none;
text-align: center;
.block1 {
width: 60px;
float: left;
.block2 {
width: 150px;
float: left;
.block3 {
width: 85px;
float: left;
.block4 {
width: 90px;
float: left;
.block5 {
width: 80px;
float: left;
.block6 {
width: 80px;
float: left;
.blockWrapper {
    width: 545px;
    margin: 0 auto;
</style>
</head>
<body>
<div class="nav_container">
<div class="blockWrapper">
<div class="block1"><a href="index.html">Home</a></div>
<div class="block2"><a href="http://www.travelingphototeam.com">TravelingPhotoTeam</a></div>
<div class="block3"><a href="#">Over Ons</a></div>
<div class="block4"><a href="#">Bijbel Open</a></div>
<div class="block5"><a href="#">Nostalgie</a></div>
<div class="block6"><a href="#">Contact</a></div>
</div>
</div>

</body>
</html>

How do I center an image inside a div tag using fluid grid layout?

where do I find and what do i use the image properties position when using the fluid grid layout. I'd like to center the image in the mobile page versus th left position in the desktop.

This is what my css codes looks like where the image is in the div tag:
#logo_links {
    clear: both;
    float: left;
    margin-left: 0;
    width: 32.2033%;
    display: block;
This is the html code where the image is:
</div>
    <div id="logo_links">
      <div align="center">
        <p><img src="../fluidgrid/images/3_7x2logo.jpg" alt="" width="236" height="110" align="left"></p>
      </div>
    </div>
I'm going to need more detail where to insert the suggested code as I am a newby!
Thanks

How do i center a div tag using css?

I am trying to learn css layout.
Starting with a blank page, I insert a couple of AP div tags and locate them where i want.
When i preveiw them in a browser, i notice that they are left justified. This is what i expect as they are Absolute positioned.
I would like them to be centered as a group. Creating a layout and centerring it on the browser window seems like a basic task.
I tried to add a div tag wrapper and center that but i cannot find where in the css panel is there any reference to center.
seems simple enough, im stumped.
Thanks
Jerry
P.S. I know as soon as i post this, i'll find the answer.

>>I tried to add a div tag wrapper and center that but i cannot find where in the css panel is there any reference to center.
Yeah that is the right approach and you can center by using following style:
#wrapper{
margin:0 auto;
Your ap divs will then absolutely position themselves within this wrapper div which acts as parent.
Regards,
Vinay

When floating DIV tags, I am unable to center the tags? help..

I am relatively new to dreamweaver, and have only used CS4 prior to CS5.5.
I am creating a website that has three columns, the header and the links bar to all other pages centers fine. But when i try and align the DIV tags it acts as if it is glued to the left or right hand side of the screen.
I am just wondering if there is a way to align the most left of the tags to directly underneath the most left of the header and the same for the right hand side?
If anybody could help it wouyld be much appreciated.
Thanks.

First, the way you have to handle multiple columns is to wrap them in a larger div.
So you'll have a container with three divs, name them left, center, right.
So here are your styles in CSS:
#container {
          width: 780px; /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
          background: #FFFFFF;
          margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
          border: 1px solid #000000;
          text-align: left; /* this overrides the text-align: center on the body element. */
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
          clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
#left {
          float: left; /* since this element is floated, a width must be given */
          width: 180px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
          background: #EBEBEB; /* the background color will be displayed for the length of the content in the column, but no further */
          padding: 5px; /* padding keeps the content of the div away from the edges */
          margin-top:15px;
#right {
          float: right; /* since this element is floated, a width must be given */
          width: 280px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
          background: #FFFFFF; /* the background color will be displayed for the length of the content in the column, but no further */
          padding: 5px 5px 5px 5px; /* padding keeps the content of the div away from the edges */
#center {
          margin: 0 290px 0 190px; /* the right and left margins on this div element creates the two outer columns on the sides of the page. No matter how much content the sidebar divs contain, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the sidebar spaces when the content in each sidebar ends. */
          padding: 0 10px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
Now, when you put together your HTML, you'll do this:
<!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>
<title>Page Title goes here</title>
<link href="path/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="container">
<div id="header">
    header goes here
    </div>
</div>
<div id="left">
Left Content Here
</div>
<div id="right">
Rightmost Content goes here. Please note the middle section comes after the right section.
</div>
<div id="center">
This is the center stuff and you will note that it has margins that keep it to the center.
</div>
<br class="clearfloat" />
<div id="footer">
Footer stuff goes here and is as wide as the main container
</div>
</div>
</body>
</html>

Easiest way to center Div Tags

I'm trying to figure out how to center div tags, i know there
are some threads about it in the past but i was wondering what's
the simplest way to do it.
Mike

Most simple way is to read the threads and find the one you
think is the
easiest.
You'll get the same replies that have been archived,
the
methods haven't changed.
If you haven't already, you would be well served searching
through the
archives for the answer to your question. The archives can be
found here:
http://groups.google.com/group/macromedia.dreamweaver
http://groups.google.com/group/macromedia.dreamweaver.appdev
You can center a div by having the content in the containing
div center
(text-align: center
, you can center a div with an auto margin (margin:
auto
. You can center a div with html and centerign your
child div <div
align="center"><div
id="CenteredDiv"></div></div>
"mikesilverman22" <[email protected]> wrote
in message
news:e675p2$4eh$[email protected]..
> I'm trying to figure out how to center div tags, i know
there are some
> threads about it in the past but i was wondering what's
the simplest way
> to do it.
>
> Mike

How do I center a container div tag in Dreamweaver?

Similar Messages

Maybe you are looking for