How do I position AP Div Tags relative to a Table?

Hi!
I know that it is possible to position an AP Div Tag relative to the header using a template in Dreamweaver. However, I am not able to position to relative when using a table so if you know how then help would be appreciated! Thank you! (I am using CS5 by the way)

webdesigner3383 wrote:
Hi!
I know that it is possible to position an AP Div Tag relative to the header using a template in Dreamweaver. However, I am not able to position to relative when using a table so if you know how then help would be appreciated! Thank you! (I am using CS5 by the way)
Not sure why you want to do this as it can be hit and miss.
I would insert a <div> in a table cell and set its position to relative and then insert an absolutely positioned <div> inside of the relatively positioned one:
<td>
<div style="position: relative;">
<div style="position: absolute; top: 50px; left: 40px;">Content goes here</div>
</div>
</td>
I think that should work although I havent tried inserting <divs> inside a <td> cell for many moons.

Similar Messages

Help with Positioning a div in relation to another div

I'm working on this website - http://soleproductions.com/virgilcardin/index.htm
I want to position the "7 Days a Week" waterdrop image just to the right of "Call Us Today..." text.
Here is my logic....
I created a div called "7daysaweek" and placed it inside the "largeimage" div and set the "largeimage" div to Relative so I could use absolute positioning of the "7daysaweek" div and set 7days div to 0 bottom, 0 right but it remains at the top left corner of the largeimage div. What am I missing?
Here is my HTML
<div id="largeimage">
        <div id="7daysaweek"><img src="../images/7-days-a-week.png" width="114" height="178" alt="7 Days a Week" /></div>
    </div>
Here is my CSS
#largeimage {
    height: 409px;
    width: 900px;
    background-image: url(images/virgil-cardin-truck1-large.jpg);
    background-repeat: no-repeat;
    position: relative;
#7daysaweek {
    height: 178px;
    width: 114px;
    right: 0px;
    bottom: 0px;
    position: absolute;

Design View isn't reliable. Use Live View or Preview in browsers.
Leading numbers like "7" are not allowed in CSS selector names. The selector name must begin with a letter.
Try this (inline styles used here for expediency):
<div id="waterDrop" style="position:absolute; top:22px; left: 800px"><img src="images/7-days-a-week.png" alt="7 Days a Week" height="178" width="114">
</div>
Nancy O.

How do I position a apDiv tag?

Hi there,
I am having trouble trying to position my apDiv tag (apDiv1).
How do i position it so that when the browser window is resized, it stays directly under the words "quick links"
Please see my page https://dl.dropbox.com/u/4966582/intranet/index.html
Also, does anyone know why two faint lines are appearing in the bottom half of the page?
Thanks
Nathan

First, there's no reason at all for apdivs in your layout. Do away with it altogether.
The lines are appearing because your footer is one big image and it's not a repeating image and either it doesn't go to the edge or it doesn't match up with your. Again this has to do with your layout. There is really no reason to make everything into big images like you have. Make a simple 450px high by 5px wide image and use it for your footer bg. Set it to repeat-x.
My suggestion would be to just start with a template or look to a framework like Bootstrap to help you out with the coding and look at making the site with CSS.
http://twitter.github.com/bootstrap/index.html

How do you make a "div" tag stretch to the top, left and right?

Hi, i'm making a professional website on dreamweaver with both codes and WYSIWYG data however i've noticed top, left and right in the CSS script for my div tags. do you know how i can "stretch" the left, right and top to make it look like one of the top div tags on one of these sites:
http://www.neopets.com/ products div tag above the site that mentions other nick products

Go into http://images.neopets.com/css/default.css?v=3
And change the width of the header from 996px to 100%.
Gary

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

How do I make a div tag trace a non-square image?

Please look at the following screen shot:
On the right, you are looking at the "Home" button of a navigation bar, and I want to see just the gray button without the triangular white parts to the left of the vertical line in the middle that are included with the div tag. I thought I would be able to make the background of the nav bar transparent and thus have the button overlap the glow / shadow surrounding the container without seeing the white parts by adding "background-color:transparent;" to the nav bar style sheet, but that didn't work.
What is the easiest way to accomplish what I am trying to do? If I am on the right track with making the background transparent, what could have gone wrong? Any help would be much appreciated.

In Photoshop...
1. Make sure any background is turned off in the layers palette so you can see the checkerboard background
2. Choose File > Save For Web
3. Select .gif from the dropdown menu
4. Make sure Transparency is checked.
5. Save

How to link to named div tags?

Where to find a list of named divs in a page or site so that I may select one to link to?
Using latest dw cc.

Not just DIV's, but any element can be a named element as long as you give it a name through a CLASS or an ID.
Normally I would use an ID for the purpose of linking because an ID may only occur once in a document. That way I know that I am pointing to just one element.
As far as finding a list of named elements, I don't think that DW facilitates this. There are outliner tools available, the most known one can be found here h5o/h5o-js · GitHub. not sure of that lists the element by name though.
What is the reason that you ask for a list of named divs?

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 to make the parent div tag hug the top of the page?

Okay, if you are not sure what I mean here is a website that has it, look at the top of the page and note that the banner is bumped up against the top of the page. http://thecreatureconservancy.org/. Anyway, I can't figure out how to do that, here is the code of the website I'm working on.
Copper Leaf Crossing is a 23 acre complex dedicated to the care of animals.We have created a warm and friendly destination for animal enthusiasts.Wether you have a cat or canary, a dog or a frog, we can help you care for your pet. On campus, you will find:       Animal Kingdom Veterinary Hospital - Their compassionate and dedicated staff are    skilled in the medical care of both domestic and exotic pets.
Creature Comforts Bed & Bath a great pet boarding facility for dogs, cats, birds, reptiles and small mammals that also offers pet grooming.
The Creature Conservancy- A truly unique non-profit organization that offers avariety of educational programs with live exotic animals, summer camps, tours and a variety of animals on display.       Dogwood Veterinary Referral Center - a full service imaging and surgery centerthat provides exceptional care for pets with neurological problems.
     4940 Ann Arbor-Saline RD Ann Arbor MI 48103
Thank you!

Try zeroing out the padding as well.
body{
margin:0;
padding:0;
If that doesn't work, you could try adding:
html{
margin:0;
padding:0;
It's difficult to know exactly without the URL and/or updated code.

Quick question about div tags

How do you make a div tag only as wide as the content that is
inside of it, rather than the width of the cell that surrounds
it?

<div style="width:200px; float:left">
Would give you a div 200px wide and floated to the left. You
can similarly
float another div to the right of this div etc. When you are
done with a row
of divs, you would want to clear the float so that the next
set of divs
starts with the extreme left as the reference point. To clear
a float you
would use style="clear:both;" or style="clear:left;" etc.
Please do some
reading on all this before you start experimenting else
you'll run into a
multitude of issues.
You cannot lose until you give up !!!
"AngryCloud" <[email protected]> wrote in
message
news:f133f2$jk4$[email protected]..
> How do you make a div tag only as wide as the content
that is inside of
> it, rather than the width of the cell that surrounds it?

Trying to make sense of div tags and css

i know that i am a few years late here, but i am looking ot make the migration from using tables and switching over to div tags and css. i have watched a few tutorials on you tube and am trying to understand everything.
please tell me if this is correct. a div tag is basically a table and css is what is used to style that div tag to meet your needs, is this a correct assumption??
if you go to my current site www.tankinz.com you can clearly see that the site is made up of tables, basically these boxes or tables contain a different item or package that a customer can click on and buy. by using div tags and css would each of these boxes, or tables be their own div?
sorry for sounding a bit moronic but i am trying to make sense of all of this.
please help!

Markup (html) contains elements, such as html, body, h1, h2, p, span, div and so forth. Hence a <div>-tag is part of an element; the other part being the </div>-tag.
The element structure of many web sites is basically (using HTML5 element names)
html
     head
     body
          header
          nav
          aside
          article
          footer
These elements can be positioned and styled using style rules (css). Depending on the style rules, the above structure can take on many different styles, without ever touching the markup.
Have a look here for a simple two-column layout using the same structure as above http://www.456bereastreet.com/lab/developing_with_web_standards/csslayout/2-col/

ADF Faces components with HTML and DIV tags

Hello all,
I want to know if there a way to place a <div> tag within an adf faces component tag? eg. <af:table> tag and insert the div tag between </af:column>? I tried doing this by placing the div tag between columns and also enclosing it with verbatim tags, but a parsing exception occurs during run time. The purpose of this is to create frozen columns for horizontal scrolling.
The code looks like:
<af:table ...>
<af:column headerText= ...>
<f:facet name= ...>
<h:outputText value= .../>
</f:facet>
</af:column>
<f:verbatim>
//DIV TAG
</f:verbatim>
<af:column headerText= ...>
<f:facet name= ...>
<h:outputText value= .../>
</f:facet>
</af:column>
<af:column headerText= ...>
<f:facet name= ...>
<h:outputText value= .../>
</f:facet>
</af:column>
<f:verbatim>
//END DIV TAG
</f:verbatim>
</af:table>
Thanks in advance.
-Wes
Message was edited by:
zeoneozero

repost
-

How do I overlap text in a Div Tag over an Image

Hi,
I have a large image which I would like to set as as border around the page.
Please see www.touchw1.com, it is the grey border with the 3 archways on it that I would like as a border. At present, everything on this screen apart from the contact details at the bottom are saved as one JPEG. I saved it like this as I don't know how to set that border as a border and then insert other div tags over, or in it? Can anyone help??
Thanks

Create a 'wrapper" and 'footer1' <div>
<div id="wrapper">
</div>
<div id="footer1">
</div>
Create some css:
#wrapper {
border: 1px solid #333;
border-bottom: none;
width: XXXpx /* width you require */
margin: 0 auto; /* centers wrapper horizontally in browser window */
#footer1 {
background-image: url(archway.gif); /*archway image plus borders */
background-repeat: no-repeat;
height: XXpx /* height of background archway image */
width: XXXpx /* width you require */
margin: 0 auto; /* centers footer1 horizontally in browser window */
Then start adding content to the 'wrapper' <div>. Insert your logo into a <h1> header.
<div id="wrapper">
<h1><img src="images/logo.jpg" width="XXX" height="XXX" alt="TouchW1 Sales and Press Agency - Central London" /></h1>
<p>TouchW1 is a newly created niche agency that specialises in all aspects of sales management, press and licensing, based in the heart of Central London</p>
</div>
<div id="footer1"></div>
Move h1 header into position in the 'wrapper" <div> with css:
h1 {
margin: XXpx XXpx XXpx XXpx; /* top, right, bottom, left */
padding: XXpx XXpx XXpx XXpx;
Do the same with the paragraph tag
#wrapper p {
margin: XXpx XXpx XXpx XXpx; /* top, right, bottom, left */
padding: XXpx XXpx XXpx XXpx;
Add rose as background to 'wrapper' <div>
#wrapper {
border: 1px solid #333;
border-bottom: none;
width: XXXpx /* width you require */
margin: 0 auto; /* centers wrapper horizontally in browser window */
background-image: url(rose.jpg);
background-position: top right;
background-repeat: no-repeat;
Hummm that its really....add a 'footer2' <div> for the address line

Re-positioning div tags

I am grappling with div tags - I am a newbie and have created an experimental web page. However all was good until I started to add a spry menu. the right container moved and I cannot figure out how to get it to move left. I tried the positioning properties but could not get it to budge! Can anyone help. I only have 2 div tags "left_column" and "right_column" plus the container The page is here
http://web.me.com/suethomo/Site2/Index.html
This is how it used to look before I mucked around with the spry menu
http://web.me.com/suethomo/Site2a/Index.html
Thanks

You didn't close the left_column so the right column is in the left column. Add </div> before <div id="right_column">

Position Image at Bottom of Div Tag

OK, so this may be the stupidest question ever, but how do I
Position an Image at Bottom of the Div Tag? I named the image and
then set;
vertical-align: bottom;
But this doesn't seem to have worked. I could achieve the
bottom alignment with multiple div tags but this seems needlessly
complicated. How should i do this?

> ok, is there a rule for when you should use an image as
a background as
> opposed to placing it normally?
No. But there are things you can do with a background image
that you cannot
do with a foreground one, and vice versa. I'm sure that's not
the answer
you wanted to hear however.
Anytime I need to place an image at a specific location
within a container
(like at the bottom, or the right edge), I'm thinking of
using a background
image.
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
==================
"jameswoody" <[email protected]> wrote in
message
news:fv5el0$dn1$[email protected]..
> ok, is there a rule for when you should use an image as
a background as
> opposed to placing it normally?
> Thanks

How do I position AP Div Tags relative to a Table?

Similar Messages

Maybe you are looking for