AP Div Tags Help

In my div tags, when they get so big, there appears a
horizontal dotted line. what does this mean? I try to color the
background of the div tag, but it only goes down till the dotted
line, and stops.

You are not paying attention to what I am saying. You only
get the dotted
line when you have specified a dimension for the container
that is SMALLER
than what you have already put into it. If you fix those
dimensions, the
dotted line will go away.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"future-architect" <[email protected]> wrote
in message
news:fmafns$m27$[email protected]..
> but what if I want to color the second half of a layer,
but it is dotted
> in half. it doesn't let me color the bottom half, which
is what I want to
> do.

Similar Messages

CS4 Div Tags Help Needed

I just upgraded to CS4. In dreamweaver I am trying to build a
site that I designed in Photoshop to Dreamweaver using all Div
Tags. I can get the container to center, but when I place other
divs on top, they wont stay where I put them. I have taken absolute
positioning off, but then they fly off position totally. How to get
around this? I have tried relative, fixed and inherit, all with the
same result. I just cant figure it out. Can anyone help me?

Most of which are erroneous guesses.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"Ian Edwards" <[email protected]>
wrote in message
news:ggb7c1$qtg$[email protected]..
> Hi
>
> it would he if you uploaded the code so we can see it.
If you do that then
> no doubt you will be deluged with solutions.
> cheers
>
> Ian
> "martcol" <[email protected]> wrote in
message
> news:ggavg8$gf7$[email protected]..
>>
quote:
Originally posted by:
[email protected]
>> ....when I place other divs on top, they wont stay
where I put them. I
>> have
>> taken absolute positioning off, but then they fly
off position
>> totally.
>>
>> Do the< div> tags sit under each other rather
than if it is what you
>> want, sit
>> side-by-side? Or do they actually, "fly off
position?" Have you thought
>> about
>> the "float" property?
>>
>> Sometimes, leaving off a single closing tag in my
code can have
>> catastrophic
>> results for positioning - have you checked if your
HTML validates.
>> Often, that
>> can be a useful way of checking if your code is the
problem.
>>
>> Martin
>>
>

Help with floating a Div tag?

I am having difficulty properly floating a div tag in my site. The page is http://www.planetwhistler.com/bandbs.html The Div on the bottom of the second column with 'content for right_bandb_div' goes here will not properly float to the right of the Div to the left of it. I have floated the 'right_bandb_' div to the left with enough of a margin to clear the div tag in the first column, I have also put the code for 'right_bandb' before the code for the div to the left of it but for some reason it won't properly place itself. Thanks for any help provided.

I realize my Template isn't exactly like yours, but you can learn from it.
http://alt-web.com/TEMPLATES/CSS-centered-round-boxes.shtml
1) apply min-height values to all your .boxes.
2) add a float clearing between rows.
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

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

Help with div tag in DWCS4

Hola
this is my first time using --or trying to used-- CSS
I have a div tag that I want to used as a navigation bar.
I type the links, and when I try to fix them with CSS, if I put a line (border top and bottom) on top of the link, the whole links Shift out of the navigation box.
Then I tried to put an inside div in the navigation div to try to control the shifting, but it didn't work, still shift out of the div nav.
I'm going to post a link later so you can "see it".
Hope you understand my problem
Thanks for your help.
Daniel Ulysses
P.S. I'm learning DW, used to have GoLive, but have to "Update", so far...I love it, just having some issues.

Try this free menu extension from List-O-Rama.
http://www.dmxzone.com/go?5618
Project VII menus:
Uberlinks -
http://www.projectseven.com/tutorials/css/uberlinks/
CSS Express Drop menus-
http://www.projectseven.com/tutorials/navigation/auto_hide/index.htm
Pop Menu Magic 2 - the best
http://www.projectseven.com/products/menusystems/pmm2/index.htm
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
www.alt-web.com/
www.twitter.com/altweb
www.alt-web.com/blogspot.com

Div tag not expanding with content.. Help please!

Hi there,
Firstly I'm reasonably new to this so if I appear stoopid, it's possible that I am.
I have been building a CSS based page with Div tags. What I'm trying to achieve is an html body that has a #wrapper centred on the page, then a #header, #nav, #banner, #content and #footer consecutively down the page. Then inside I want to place a #leftColumn and a #rightColumn. This much I have achieved. What I'm having trouble with is having the content div expand with the two column divs within it. I've included the main.css file I'm using below as well as the source code for the content section of the page. Any help would be greatly appreciated.
Cheers,
Philamon
@charset "UTF-8";
body {
color: #FFF;
text-align: center;
margin: 0px;
padding: 0px;
#wrapper {
color: #000;
text-align: left;
width: 760px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
#header {
color: #000;
margin-top: 12px;
margin-bottom: 12px;
#content {
color: #000;
width: auto;
margin-top: 0px;
padding-top: 0px;
padding-left: 5px;
overflow: auto;
#footer {
color: #000;
margin-top: 5px;
margin-bottom: 0px;
clear: both;
text-align: center;
bottom: 0px;
left: 0px;
right: 0px;
position: relative;
#logo {
color: #000;
height: 71px;
padding-bottom: 10px;
padding-right: 5px;
#nav {
color: #000;
height: 28px;
#banner {
color: #000;
height: 200px;
text-align: center;
#leftColumn {
color: #000;
float: left;
width: 70%;
padding-right: 5px;
padding-bottom: 30px;
padding-left: 5px;
#rightColumn {
color: #000;
float: right;
width: 20%;
padding-right: 5px;
padding-left: 5px;
padding-bottom: 30px;
.fltrt {
float: right;
<div id="content">
    <h1>Welcome to The Groundswell Division</h1>
    <div id="leftColumn">
      <h2>Mission Statement</h2>
      <p>The Groundswell Division aims to:</p>
      <p>Be involved in the future moulding of the Australian performing arts industry through attracting new audiences, working collaboratively to find new forms and helping to expand the scope of performing arts in Australia.<br />
        Provide vital, diverse and challenging artistic works for audiences, both locally in Melbourne, throughout Australia and internationally.<br />
        Provide a platform for local performing arts practitioners who are currently underutilised within the industry.<br />
        Provide an umbrella for independent artists to stage their works within an established, supportive company.<br />
        Make all decisions regarding creative direction and control in an open, honest forum by the members of the Company’s democratic committee. </p>
    </div>
    <div id="rightColumn">
      <h2>Subheading</h2>
      <p> Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. </p>
    </div><div id="leftColumn2">
      <h2> </h2>
</div>
</div>

Hi,
Change your wrapper code to this.
#wrapper {
width: 760px;
margin: 0 auto;
color: #000;
text-align: left;
You haven't included the Wrapper Div in your code :
You haven't specified and CSS markup for leftColumn2.
I have included an example (the div sizes will need adjusting!)
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<style type="text/css">
@charset "UTF-8";
body {
color: #FFF;
text-align: center;
margin: 0px;
padding: 0px;
#wrapper {
width: 760px;
margin: 0 auto;
color: #000;
text-align: left;
#header {
color: #000;
margin-top: 12px;
margin-bottom: 12px;
#content {
color: #000;
width: 740px;
margin-top: 0px;
padding-top: 0px;
padding-left: 5px;
overflow: auto;
#footer {
color: #000;
margin-top: 5px;
margin-bottom: 0px;
clear: both;
text-align: center;
bottom: 0px;
left: 0px;
right: 0px;
position: relative;
#logo {
color: #000;
height: 71px;
padding-bottom: 10px;
padding-right: 5px;
#nav {
color: #000;
height: 28px;
#banner {
color: #000;
height: 200px;
text-align: center;
#leftColumn {
color: #000;
float: left;
width: 400px;
padding-right: 5px;
padding-bottom: 30px;
padding-left: 5px;
#leftColumn2 {
color: #000;
float: left;
width: 100px;
padding-right: 5px;
padding-bottom: 30px;
padding-left: 5px;
#rightColumn {
color: #000;
float: left;
width: 100px;
padding-right: 5px;
padding-left: 5px;
padding-bottom: 30px;
.fltrt {
float: right;
}</style>
</head>
<body>
<div id="wrapper">
<div id="content">
<h1>Welcome to The Groundswell Division</h1>
    <div id="leftColumn">
      <h2>Mission Statement</h2>
        <p>The Groundswell Division aims to:</p>
        <p>Be involved in the future moulding of the Australian performing arts industry through attracting new audiences, working collaboratively to find new forms and helping to expand the scope of performing arts in Australia.<br />
        Provide vital, diverse and challenging artistic works for audiences, both locally in Melbourne, throughout Australia and internationally.<br />
        Provide a platform for local performing arts practitioners who are currently underutilised within the industry.<br />
        Provide an umbrella for independent artists to stage their works within an established, supportive company.<br />
        Make all decisions regarding creative direction and control in an open, honest forum by the members of the Company's democratic committee. </p>
    </div>
    
    <div id="leftColumn2">
    <h2></h2>
    </div>
     
    <div id="rightColumn">
    <h2>Subheading</h2>
    <p> Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. </p>
    </div>
     
   </div>
    
    <div id="footer">
    <h2>Footer</h2>
    </div>
    
</div>

</body>
</html>
Hope this helps ;-)

Help- check box on when the page is loaded first time have to show div tag

posted Yesterday 11:48 PM
Hi Friends,
I have a check box and the information of if it is checked or not comes from Actionform get, I want the div tag to be displayed when the jsp is first loaded and the check box is checked.
Can some one help me in sending the sample code for this.
with regards,
Bhargavi.

Hi Scott,
Declare a SessionBean variable to hold the unique key field value for that table. Set that value when the user clicks on the button. Use the value to select only that row on the next iterattion of the page in RowSet.setCommand statement.. You will want to do some conditional initialization for this page depending upon whether or not this seesion bean variable has been initialized.

Help needed creating vertical bullet list using div tag and css

Hi,
I think there is something quite fundamental that I'm missing when using div tags - I seem to keep running into problems with them.
I'm trying to create a vertical bullet list. It works fine when I try the code on its own as follows:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">

</style>
<head>
</head>
<body>
<div id="techlistcontainer">
<ul id="techlist">
          <li>Java Messaging Service (JMS)</li>
          <li>Message Driven Beans </li>
          <li>Remote Session EJBs with multi-threading</li>
          <li>Message Oriented Middleware(MOS) such as Websphere MQ series, Mercator with SAP/ERP</li>
          <li>XML messaging</li>
          <li>CORBA (Common Object Request Broker Architecture), RMI (Remote Method Invocation)</li>
    </ul>
</div>
</body>
</html>
http://www.pa-solutions.co.uk/vertical_list.html
When I insert that into my site template page, its all over the place:
http://www.pa-solutions.co.uk/development.html
I've put the css code into a seperate file http://www.pa-solutions.co.uk/pas.css - I get the same results when its embedded into the html doc.
Please help before I pull all my hair out.
Thanks,
Phil.

Unless you know what you're doing with absolute positioning, avoid absolute positioning! Absolute positioning actually takes an element out of the normal HTML document flow and positions it absolutely in relationship with it's first parent with a position other than static - for details read the HTML specs at the W3C.
Ideally you should use the normal HTML document flow. Divs are block level elements meaning that they act like blocks that take up a height (determined by children content) and width (the full width of the page or it's parent container, unless you tell it otherwise).
For your CSS try this:
#techlistcontainer {
    width: 75%;
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 0;
    margin-left: 30;
    padding-top: 0;
    padding-right: 0;
    padding-bottom: 0;
    padding-left: 30;
How does that work with your templates?

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>

Hidden and visible div tags, transparence and links - HELP....

I am showing different products in div tags that are controlled by simple javascript. I would like to add text links to open a new div tag about the related products, but also hide the original div tag that the link is placed on.
Please check this page out
http://www.aestheticgroup.fr/New/Inex/Inex_lipoAspirationR.html
and then click on the image for
CANULES D’ASPIRATION PROXIMALE
and then click on the text link:
manche BD 300 10
You will understand my problem. I'm trying to make this div tag (Canule d’aspiration Proximale) disappear instead of having them stack one on top of the other.
Do you have an idea of how I can add multiple functions to one click (close the div tag and open a new one at the same time)?
Thank you for your help!
Sooooophie

Hi Sophie,
I downloaded your site and yes, there was a typo in the script...
The script should read...
var curOverlay = null;
function overlay( aOly) {
var el = document.getElementById(aOly);
if (curOverlay) curOverlay.style.visibility = "hidden";     // THIS LINE HAS CHANGED
if (curOverlay != el) {
    el.style.visibility = "visible";
    curOverlay = el;
else
    curOverlay = null;
I also realize that wherever you call an overlayXX function that you are currently using, you'll need to replace it with a call to overlay('overlayXX')
I needed to add this to your onclick attribute for the close button... I tested this and it seems to work for the existing page.
here are the snippets from your page that I changed
      <div id="Groups02"><a href='#' onclick='overlay("overlay02")' onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image21','','images/LipoReutilisable02B.jpg',1)"><img src="images/LipoReutilisable02.jpg" name="Image21" width="170" height="120" border="0" id="Image21" /></a>
        <p>CANULES D’ASPIRATION <br />
        UN ORIFICE</p>
      </div>
and for the close button:
   <div id="close02"><a href='#' onclick='overlay("overlay02")' onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image43','','images/close.jpg',1)"><img src="images/close02.jpg" name="Image43" width="72" height="20" border="0" id="Image43" /></a></div>
You'll need to change this wherever you reference each overlay, in this case, it was for overlay02. The good news is you'll only need this function and not one function per overlay as you have now.
As I said in the previous post, I am off on vacation for a little over a week.
Good Luck!

Please help! IE6 won't display my div tags!

My page looks fine in the other Mac browsers but the divs won't show up in Internet Explorer. Please tell me what I am doing wrong and how to fix it so that my div tags display correctly. Here is my source and CSS code:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title>Untitled Document</title>



<style type="text/css">

</style>
<link href="../navmenu.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="wrapper">
<div id="logo"></div>
<div id="nav"></div>
<div id="buffer">this is a buffer</div>
</div>
</body>
</html>
     margin: 0px;
     padding: 0px;
#wrapper {
     width: 909px;
     background-color: #999;
     margin-right: auto;
     margin-left: auto;
     height: 54px;
     overflow: auto;
#wrapper #logo {
     width: 208px;
     float: left;
     background-color: #33F;
     height: 39px;
#wrapper #nav {
     background-color: #933;
     float: right;
     width: 701px;
     height: 39px;
#wrapper #buffer {
     width: 909px;
     clear: both;
     background-color: #0F6;
     height: 15px;

Because IE 6 is 5+ years old and hasn't been updated in a long while and the only reason it's still kicking in somewhat decent numbers is because some large companys utilized IE-only type features for internal applications and intranets and thus forced Microsoft to conitnue to support it beyond the original end-of-support date. :-)
By the way, potentially you could just give IE 6 a really bare-bones layout - but you'll need to make sure that that's acceptable for the project. Also it's good for your sanity if you stop trying to make the site look exactly the same in every browser. It's much easier to make it look "good enough" and make sure that the content is accessible and the site usable.

Help with Div Tags

Hello,
I've got 2 flash files in separate div tags. Div 1 is sized 100% x 100% to match the movie, and the other div tag is set at 900px x 700px (again to match the movie). The 1st tag sort of acts as a background to the top layer. This all works great and really happy with the result.
My only problem is when the browser window gets smaller than the top layer a scroll bar appears (this is no problem, i actually don't want the top layer to resize due to text legibility etc.) but what i notice is that when you scroll to view the rest of the top layer, the bottom layer no longer fills the screen, the remainder of the screen is now white, it actually cuts off some of the image from where the window was in it's last position.
this is the site:
http://www.baycreative.co.uk/Test.html
Any suggestions to why this is happening?

Try this tutorial instead. I believe the one you are
following is flawed.
Taking a Fireworks comp to a CSS-based layout in Dreamweaver
http://www.adobe.com/devnet/fireworks/articles/web_standards_layouts_pt1.html
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"ck64" <[email protected]> wrote in message
news:g17del$r7k$[email protected]..
> Hello all,
> Just started using Dreamweaver and was following a
tutorial about making a
> layout in Photoshop, slicing it, and then importing it
into Dreamweaver.
> Then I
> delete the content portions of the image and add a box
with DIV tags.
>
> Now, the site works just fine when I put only a single
line of
> text/content
> for both FF and IE.
>
> However, once I add a second line, the site becomes a
mess in FF.
>
> I have the site hosted with 2 lines of text in my main
content box here:
>
http://cnorthington.site.io/sitebase.html
>
> Any advice you can offer would be great.
>
> Thanks,
> Chris.
>

Help with DIV tags (i think)

Hello all,
Just started using Dreamweaver and was following a tutorial
about making a layout in Photoshop, slicing it, and then importing
it into Dreamweaver. Then I delete the content portions of the
image and add a box with DIV tags.
Now, the site works just fine when I put only a single line
of text/content for both FF and IE.
However, once I add a second line, the site becomes a mess in
FF.
I have the site hosted with 2 lines of text in my main
content box here:
http://cnorthington.site.io/sitebase.html
Any advice you can offer would be great.
Thanks,
Chris.
P.S. This is what it looks like without content:
http://cnorthington.site.io//sitebasetwo.html

Try this tutorial instead. I believe the one you are
following is flawed.
Taking a Fireworks comp to a CSS-based layout in Dreamweaver
http://www.adobe.com/devnet/fireworks/articles/web_standards_layouts_pt1.html
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"ck64" <[email protected]> wrote in message
news:g17del$r7k$[email protected]..
> Hello all,
> Just started using Dreamweaver and was following a
tutorial about making a
> layout in Photoshop, slicing it, and then importing it
into Dreamweaver.
> Then I
> delete the content portions of the image and add a box
with DIV tags.
>
> Now, the site works just fine when I put only a single
line of
> text/content
> for both FF and IE.
>
> However, once I add a second line, the site becomes a
mess in FF.
>
> I have the site hosted with 2 lines of text in my main
content box here:
>
http://cnorthington.site.io/sitebase.html
>
> Any advice you can offer would be great.
>
> Thanks,
> Chris.
>

Floating div tags - won't align

Hi there,
I am trying to align 2 div tags next to one another in the latest version of dreamweaver cc. At the moment I have one floating to the left 60% wide and on the the right 40% wide. The second div tag sits on the next line down to the right but I can't seem to get them the sit directly next to one another. Please help Thank you

Copy & paste this code into a new, blank document. SaveAs test.html and preview in browsers.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>HTML5 Document</title>

<style>
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
body {
    padding: 0;
    width: 90%; /**adjust width as required**/
    margin: 0 auto; /**this is centered**/
    background: #F5DD83;
    color: #2294AE;
    font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
    font-size: 100%;
    box-shadow: 2px 2px 4px #333;
header {
    margin: 0;
    padding: 0 1%;
    width: 100%;
    background: #B00202;
    color: #FFF;
header h1, header h2 {
    display: inline;
    color: #F5DD83;
    padding: 0 3%;
section {
    margin: 0;
    padding: 0;
    background: #FFF;
    overflow: hidden; /**float containment**/
article {
    margin: 0;
    padding: 0 2%;
    float: left;
article.left { width: 60%; }
article.right {
    border-left: 1px solid #366;
    width: 40%;
footer {
    background: #B00202;
    clear: left;
    display: block;
    padding: 2%;
    color: #FFF;
</style>
</head>
<body>

<header>
<h1>Sitename</h1>
<h2>Some pithy slogan...</h2>
<nav>Horizontal menu goes here...</nav>
</header>

<section>
<article class="left"> <h3>Article Left 60% wide</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vitae libero lacus, vel hendrerit nisi!
Maecenas quis velit nisl, volutpat viverra felis. Vestibulum luctus mauris sed sem dapibus luctus. </p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vitae libero lacus, vel hendrerit nisi!
Maecenas quis velit nisl, volutpat viverra felis. Vestibulum luctus mauris sed sem dapibus luctus. </p>

</article>

<article class="right"> <h3>Article Right 40% wide</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vitae libero lacus, vel hendrerit nisi!
Maecenas quis velit nisl, volutpat viverra felis. Vestibulum luctus mauris sed sem dapibus luctus. </p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vitae libero lacus, vel hendrerit nisi!
Maecenas quis velit nisl, volutpat viverra felis. Vestibulum luctus mauris sed sem dapibus luctus. </p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vitae libero lacus, vel hendrerit nisi! Maecenas quis velit nisl, volutpat viverra felis. Vestibulum luctus mauris sed sem dapibus luctus. </p>
</article>

<footer> <small>© 2014 Your Site Name. All rights reserved</small> </footer>
</section>
</body>
</html>
Nancy O.

Noob question about DIV tags

Learning DW and CSS so patience is in order .
I've being reading numerous posts here and on the web about avoiding tables for laying out web pages. I can see the advantages in terms of cleaner codes and easiness of updating and changing sites at a later time. So I started learning about DIV tags (although tables is very easy for me) and have practice a few times with fairly good results, love the absolute positioning with it. Having said that, for the love of me, can't find a way of centering horizontally a page designed with DIV tags (due to ignorance), for example, 1 column/three rows page, after defining styles, size and colors I enclosed everything in another DIV tag, wrapper I think is called, but have not found a way of centering it on the page, text-aligment on the DIV tag only centers the text not the DIV itself, how to go about this? Help is appreciated.

love the absolute positioning with it.
Get over it. It's a trojan horse. Absolute positioning is not a general layout method.
To center ANY block (non-absolutely positioned) element, use CSS to give it a width and left/right margins of 'auto'. For example -
<div id="foo">...</div>
That div will be centered with this CSS -
#foo { width:300px; margin:0 auto; }
I think you are on the wrong path already, though. Stick with tables (which you say are very easy for you) UNTIL you a) understand CSS well enough to understand what absolute positioning is and why I say it's bad, and b) understand how to use float, margin, and padding to place things on the page. Then you are ready to move away from tables.

AP Div Tags Help

Similar Messages

Maybe you are looking for