Dreamweaver adding div height in tooltip?

I dont normally use dreamweaver, but I must for this project,
in dreamweaver for some bizarre reason the tooltip says height 50px
(54px) and has added 4pxs to an image in a div. Anyone know why? It
aligns in the browsers, IE 6, firefox, but why has dreamweaver
added these 4 pixels and given it a gap in dreamweaver?
Picture example:
http://homepage.ntlworld.com/spensley/dreamweaverbug.jpg
anyone know why and what this is all about?
The css:
#logo{
top: 30px;
width:126px;
height: 51px;
padding:0px;
float: left;
html:
<div id="logo"><a href="index.html"><img
src="media/images/gtfLogo.jpg" title="GTF logo" alt="GTF logo
design" longdesc="three circles showing the letters G, T and F in
orange and green" width="126"
height="51"/><a/></div>

Oops - sorry - missed the CSS.
You have a munged <a> tag -
orange and green" width="126" height="51"/><a/></
should be -
orange and green" width="126" height="51"/></a></
Does that solve the problem?
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
==================
"spongebobcirclepants" <[email protected]>
wrote in message
news:[email protected]...
> <?xml version="1.0" encoding="utf-8"?>
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Strict//EN"
> "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
> <html xmlns="
http://www.w3.org/1999/xhtml"
xml:lang="en" lang="en">
> <head>
> <title>GTF - Gardens, Tools &
Furniture</title>
> <meta http-equiv="Content-Type" content="text/html;
charset=UTF-8" />
> <meta name="keywords"
>
content="tools,gardens,furniture,spades,water,toys,toy,gardening,uk,giant
>
toys,giant,lawnmowers,tool,diy,outdoor,outdoors,pool,shovels,hoses,hose,fish,aqu
> atics,benches,tables,chairs" />
> <meta name="description" content="GTF Company Site"
/>
> <meta name="author" content="Roy Spensley" />
>
> <link rel="stylesheet" type="text/css"
href="style/textformat.css"/>
> <link rel="stylesheet" type="text/css"
href="style/layout.css"
> title="default"
> />
>
> </head>
>
> <div id="wrapper">
>
> <div id="topSpace"></div>
> <div id="logo"><a href="index.html"><img
src="media/images/gtfLogo.jpg"
> title="GTF logo" alt="GTF logo design" longdesc="three
circles showing the
> letters G, T and F in orange and green" width="126"
> height="51"/><a/></div>
> <div id="logoRight"></div>
> </div>
> </body>
> </html>
>
>
> css
>
>
>
> /*BODY*/
>
> body{
>
> margin-top:0px;
>
> margin:0px;
>
> left:0px;
>
> padding:0px;
>
> font-family: arial, Helvetica, sans-serif;
>
> font-size: 100.1%;/*fixes bug in IE*/
>
> color:#333333;
>
> text-align: center;
>
> background-color: #666666;
>
> overflow: auto;
>
> }
>
> /*ALL IMAGES*/
>
> img{
>
> border-style: none;
>
> }
>
>
> /*CONTAINING WRAPPER*/
>
> #wrapper{
>
> width: 800px;
>
> margin-top: 0px;
>
> height: 597px;
>
> background-color: #000;
>
> margin: 0 auto; /*This will now centre in firefox as
well*/
>
> }
>
> #topSpace{
>
> width: 100%;
>
> height: 30px;
>
> padding:0px;
>
> background-color: #fff;
> }
>
> #logo{
>
> top: 30px;
>
> width:126px;
>
> height: 51px;
>
> padding:0px;
>
> float: left;
>
> }
>

Similar Messages

Inserting Images into Dreamweaver through Div Tag

Hi im quite new to Dreamweaver and i've got CS3...I've just
designed and sliced up a website in Photoshop and have started to
compile it together in Dreamweaver using HTML and CSS. I've just
added a Div tag and added images into the page and i've got stuck,
i cant seem to put another image next to one iv already placed
their.
I need help on how to work with Div Tags and applying images
so that i can fix my website like a Jigsaw.
I have provided the code i hav in my HTML so far...

Maybe this will help you -
Taking a Fireworks comp to a CSS-based layout in Dreamweaver
http://www.adobe.com/devnet/fireworks/articles/web_standards_layouts_pt1.html
http://www.adobe.com/devnet/fireworks/articles/web_standards_layouts_pt2.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
==================
"DThandi" <[email protected]> wrote in
message
news:gk8anj$4qc$[email protected]..
> Let me show you the before and after images of the site
im working on,
> then
> maybe what im trying to describe can become more
clearer...Your right that
> i do
> need some basic understanding, I actually used to know
the answer to my
> own
> question but since i havn't played around with
Dreamweaver for a while i
> seem
> to have forgotten.
>
> This was the image on Photshop:
>
http://i187.photobucket.com/albums/x151/ohhchakdeh/SAMPLE.jpg
>
> This is where I am stuck now:
>
http://i187.photobucket.com/albums/x151/ohhchakdeh/stuck.jpg
>
> These are all the small images i have sliced up from
Photshop:
>
http://i187.photobucket.com/albums/x151/ohhchakdeh/Untitled.jpg
>
> As you can see i have trouble coding in HTML. So far i
have been
> following a
> tutorial video showing me how to had images and align
them through Div
> Tag...But now i am trying to put images side by side in
the Navigation
> area and
> on top of and underneath each other. As you can see i
have Home.jpg and
> Home-Scrap.jpg. Home Scrap needs to go under Home and
both of them images
> need
> to go next to image Left-Short.jpg.
>
> Thank You
>

Dreamweaver set page height in CSS

Hi everyone. What is causing this giant white space under my bottom menu bar?
I know now I should have used divs and padding, but I've spent all afternoon position every element using relative positioning and don't want to have to redo my entire website!
Here's the website:
http://www.jhurleydesign.com/_drivetastic_site/
Here's my CSS:
@charset "UTF-8";
body {
    width: 1018px;
    margin-left: auto;
    margin-right: auto;
.lgo {
    position: relative;
    top: 0px;
    right: 0px;
    z-index: 20;
.tbr {
    position: relative;
    top: -49px;
    right: 0px;
    background: url(../_images/best.png) repeat-x;
    height: 45px;
    width: 1018px;
    z-index: 10;
.tmu {
    position: relative;
    top: -87px;
    right: -350px;
    z-index: 30;
    border: none;
    outline: none;
.bbr {
    position: relative;
    top: -48px;
    right: 0px;
    background-color: #212121;
    height: 45px;
    width: 1018px;
    z-index: 10;
.bmu {
.bmu .mi {
    font-family: Helvetica, Arial;
    font-size: 8px;
    font-weight: 850;
    position: relative;
    top: -80px;
    right: 0px;
    z-index: 30;
    border: none;
    padding-left: 20px;
    text-decoration: none;
    display: inline;
a.mui:link {color: #FFF;
text-decoration: none;
a.mui:visited {color: #FFF;
text-decoration: none;}
a.mui:active {color: #8a130d;text-decoration: none;}
a.mui:hover {color: #8a130d;
text-decoration: none;}
.bmu .cr {
    font-family: Helvetica, Arial;
    font-size: 8px;
    font-weight: 850;
    position: relative;
    top: -92px;
    right: -816px;
    z-index: 30;
    border: 0;
    padding-left: 20px;
    text-decoration: underline;
a.crt:link {
    color: #FFF;
    text-decoration: underline;
a.crt:visited {color: #FFF;
text-decoration: underline;}
a.crt:active {color: #8a130d;text-decoration: underline;}
a.crt:hover {color: #8a130d;
text-decoration: underline;}
.lrn {
    position: relative;
    top: -160px;
    right: -20px;
    z-index: 15;
.grd {
    position: relative;
    top: -590px;
    right: 0px;
    background-color:#e8e8e8;
    height: 295px;
    width: 1018px;
.lgrd {
    position: relative;
    top: -590px;
    right: 0px;
    background-color:#fbfbfb;
    height: 443px;
    width: 1018px;
    z-index: -10;
.stm {
    position: relative;
    top: -1300px;
    right: -535px;
.container {
    position: relative;
    top: -1226px;
    right: -23px;
    z-index: 10;
.container .txt {
    font-family: Helvetica, Arial;
    font-size: 14px;
    display: inline;
    width: 215px;
    padding-right: 36px;
    float: left;
    display: inline;
    color: #a5a5a5;
.container .txt img {
.container .txt a {
    float: left;
    padding-top: 23px;
.prms {
    position: relative;
    top: -1120px;
    right: -8px;
    float: left;
    display: inline;
.tst {
    position: relative;
    top: -1152px;
    right: -44px;
.prms .txt {
    padding-top: 11px;
    color: #8a130d;
    font-family: Arial, Helvetica;
    width: 459px;
.prms .ltxt {
    position: relative;
    top: -20px;
    font-family: Arial, Helvetica;
    color: #494949;
    font-size: 12px;
    font-family: Arial, Helvetica;
    height: 36px;
    width: 260px;
    position: relative;
    top: 10px;
    padding-bottom: 138px;
    float:left;
    display: inline;
.quoteimgs {
    position: relative;
    top: -1444px;
    right: -591px;
    padding-bottom: 0px;
.prms .ltxt {
.prms .ltxt p {
    margin-bottom: -px;
.prms .ltxt p a:link{
    color: #8a130d;
    text-decoration: none;
.prms .ltxt p a:visited{
    color: #8a130d;
    text-decoration: none;
.prms .ltxt p a:active{
    color: #8a130d;         text-decoration: underline;}
.prms .ltxt p a:hover{color: #8a130d;
text-decoration: underline;}
.btmub {
Please someone give me a work around to force the page height? Need to get rid of that white space
If someone could find out what's causing the page to be bumped down...honestly spent hours and hours looking and deleting parts of my CSS and I can't work it out at all

If your were to remove all positioning (highly recommended) and just let the normal document flow determine your page height, you would have far fewer problems. Suggest you start your project with a pre-built CSS Layout that has all the columns and containers you need. This will save you many hours of needless frustration, too.
DW Starter Pages (free)
http://www.adobe.com/devnet/dreamweaver/articles/introducing_new_css_layouts.html
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb
http://alt-web.blogspot.com/

Adobe dreamweaver cc div option not to be seen, how do i get it back?

Hi all,
Am using dreamweaver CC, creating a fluid layout using div's, when a div is selected there is option panel, that allows you to: hide, re-position it, delete it, copy, move up and move down.
This works fine for a while then it disappears and I can't re-size div's or move them around, but now doing manually which would consume more time, which i wouldn't opt for.
Could i please know how do i get back this option panel for div's?

sharath.k wrote:
@Nancy:
Thanks for the reply nancy.
Not able to figure out the connection between, having the DIV editing options being disbaled and if there are errors on html/css layout.
DW does some pretty strange things when it runs into code errors.
For example, placing the letter "x" in the CSS column definitions for a fluid grid layout disables the FGL tools AND brings back Design View in DW CC2014.1. Design View is normally disabled for Fluid Grid Layouts in that version and a single misplaced character defeats DW's detection of FGL entirely.
Other code errors, like unclosed tags, invalid nesting and unclosed quotes can cause problems up to and including making Design View completely blank, even though you have hundreds of lines of html in Code View.
It may not be the problem, but it's definitely worthwhile to validate code frequently to catch small issues before they turn into big ones.

Dreamweaver CS4 - Div is shifting left on iPad

Hi,
I'm embedding a forums.org forum into a div on one of my pages and it looks great on the desktop (Safari, Chrome and Firefox).
But on my ipad the div is shifting over about 15 pixels to the left.
Any advice would be most appreciated!
Mark

What you are doing is a really bad idea: an absolutely positioned div that is added outside all content at the top of the code.
It does not help that the entire page was (seemingly) sliced in Photoshop or Fireworks, and exported as is - you should embed the iframe div in the fourth row, replace the image tag with a css background, and then center with margin: 0 auto. Remove the absolute positioning, the left, the top, the z-index, and negative margin junk.

Equal div heights

Hello good people!
Need a little bit newbie type help for working on CSS.
Here's my code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<META content="text/html; charset=windows-1257" http-equiv="Content-Type">
<TITLE>
</TITLE>
<STYLE type="text/css">
body {
background-color:#FFFFFF;
margin-top:50px;
#container {
width: 750px;
margin: 0px auto 0px auto;
#header {
background:#CCCCCC;
padding:10px;
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
#left {
background:#CCCCCC;
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
margin-top:2px;
margin-bottom:2px;
width:130px;
padding:10px;
float:left;
height:auto;
#center{
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
margin-top:2px;
margin-bottom:2px;
width:430px;
padding:10px;
float:left;
#right{
background:#CCCCCC;
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
margin-top:2px;
margin-bottom:2px;
width:130px;
padding:10px;
float:right;
#footer{
background:#CCCCCC;
padding:10px;
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
margin-top:2px;
clear:both;
</STYLE>
</HEAD>
<BODY>
<div id="container">
<div id="header">This is header.</div>
<div id="left">Some text on left. It's good to see it.</div>
<div id="center">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent massa massa, mattis eget rhoncus ut, egestas eget orci. Fusce hendrerit tempor nibh quis gravida. Donec vehicula est tristique massa facilisis nec tempus augue porttitor. Aliquam erat volutpat. Nulla pellentesque, nibh vel auctor ultrices, tellus eros gravida tellus, vehicula volutpat odio dui vel tortor. Cras semper risus in felis rhoncus adipiscing. Vivamus feugiat facilisis varius. Pellentesque venenatis lectus sem, tincidunt placerat mi. Aliquam interdum ultrices dui. Nam vitae ante et massa lobortis facilisis sed id libero. Aenean ac porta lectus. Donec euismod condimentum quam eu viverra. Sed consequat massa vel elit condimentum eleifend nec at nunc. Donec lacus velit, euismod quis elementum vel, tempor tincidunt mi. Pellentesque odio nunc, tempor dapibus.</div>
<div id="right">It is the right column.</div>
<div id="footer">This is some piece of text in the footer.</div>
</div>
</BODY>
</HTML>
And the question is:
The problem is, that I can not make #left and #right to be set to the same height as the #center div. Please help.
Thank you.
Mykolas

Equal height CSS columns are challenging because divisions do not speak to each other. Their height is determined by content and can vary from page to page and by end-user's browser settings.
You have three options:
1) Start your project with a special template that provides for equal height CSS columns:
http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks
2) Fake it with a 2 or 3-toned background image that repeats vertically down the page. This method is called Faux Columns.
http://alt-web.com/TEMPLATES/2-column-fixed-width-template.shtml
3) Use a Javascript.
http://www.projectseven.com/tutorials/css/pvii_columns/index.htm
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

Dreamweaver adding unwanted javascript

I have been having a problem for a while now where even
though I have moved my javascript to an external file and inserted
a standard link to this javascript file in the <head> area of
a site template Dreamweaver intermittently adds the javascript
itself back to the template thereby applying it to the various
pages in the site on saves. Sometimes clearing the javascript out
of the <head> area of the template and applying the template
to the pages in the site clears the offending javascript out,
sometimes not. The pages function as desired without the javascript
added back, in other words the link to the external file works.
I would like to keep the javascript (only a few lines to
allow image swapping for rollovers) in an external file in order to
keep the page code clean but Dreamweaver keeps occasionally adding
it back.
Here is the actual code I am using to link to the external
file from the <head> section: (<script
type="text/javascript"
src="javascript/script.js"></script>). I am using
Dreamweaver version 8.
Has anyone else experienced this behavior? Any
solutions?

> Has anyone else experienced this behavior? Any
solutions?
It's a known issue with legacy versions of DW. There is no
workaround that
I know of. It will happen with non-templated pages, as well.
It only happens when you EDIT a behavior that is in the
external javascript
file.
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
==================
"deruand" <[email protected]> wrote in
message
news:frpkhv$oiv$[email protected]..
>I have been having a problem for a while now where even
though I have moved
>my
> javascript to an external file and inserted a standard
link to this
> javascript
> file in the <head> area of a site template
Dreamweaver intermittently adds
> the
> javascript itself back to the template thereby applying
it to the various
> pages
> in the site on saves. Sometimes clearing the javascript
out of the <head>
> area
> of the template and applying the template to the pages
in the site clears
> the
> offending javascript out, sometimes not. The pages
function as desired
> without
> the javascript added back, in other words the link to
the external file
> works.
>
> I would like to keep the javascript (only a few lines to
allow image
> swapping
> for rollovers) in an external file in order to keep the
page code clean
> but
> Dreamweaver keeps occasionally adding it back.
>
> Here is the actual code I am using to link to the
external file from the
> <head> section: (<script type="text/javascript"
> src="javascript/script.js"></script>). I am
using Dreamweaver version 8.
>
> Has anyone else experienced this behavior? Any
solutions?
>

Dreamweaver CS3 Div Alignment Problems.

I have been building a website on my new MacBook. I have it
just about done so I uploaded it to my web host to check out the
appearance. It looks great on my Mac, but I checked it on my
parents PC and it looked terrible. Being a new Mac user, I thought
it was something going on with the operating systems, but I checked
it on a Mac deskop and the alignment was still messed up. On the
Mac desktop it is too far to the left and on the PC it is too far
to the right. This is the link to the site:
http://www.potomacsouth.com/Home.html
You can click View>Source to see the code.
I noticed if you drag the window to a different size the
images behind the div move, but the div stays in place. Is there
some kind of code or something that I can do to make it stay in the
designated area on every computer regardless of settings?
Thanks.

evansdb78 wrote:
> I noticed if you drag the window to a different size the
images behind the div
> move, but the div stays in place. Is there some kind of
code or something that
> I can do to make it stay in the designated area on every
computer regardless of
> settings?
Thats because you are using Absolutely Positioned
<divs> so they stay...
well.... Absolutely Positioned i.e., they WILL NOT move as
you increase
or decrease the width of the browser window.
Solution:
Open your page and go to code view
FIND THIS PIECE OF CODE:
<div align="center"><img src="
http://www.potomacsouth.com/Site-Top.jpg"
width="832" height="558" /><br />
CHANGE IT TO:
<div style="position: relative; width: 832px; margin: 0
auto;">
<img src="
http://www.potomacsouth.com/Site-Top.jpg"
width="832"
height="558" /><br />
NOW FIND YOUR ABSOLUTELY POSITIONED <DIV> CODE:
<div id="apDiv2">
<p class="style6"><u><span
class="style8">Welcome</span></u><span
class="style8">!</span></p>
<p align="left" class="style5"> Welcome to
PotomacSouth.com where
you can leave your work and worries on the beach. Whether you
are
looking to get in on the fishing action Maryland and Virginia
waters
have to offer, or take a tour to one of our destinations via
the water
Potomac South can get you there. We offer tours of St. George
Island
and its surrounding waters including a look at what the local
fish nets
have caught, stop and see the Lighthouse, and two state
parks, Historic
St. Marys City, and Point Lookout. If food is on your
mind take an
evening cruise to catch a bite to eat at The Mooring
Restaurant. If you
have any questions or are interested in a trip today give
Captain Dan a
call or email through our Contact Us
link.</p>
</div>
MOVE IT TO DIRECTLY BETWEEN THE TWO LINES OF CODE YOU
ORIGINALLY
CHANGED. SO IT LOOKS AS BELOW:
<div style="position: relative; width: 832px; margin: 0
auto;">
<div id="apDiv2">
<p class="style6"><u><span
class="style8">Welcome</span></u><span
class="style8">!</span></p>
<p align="left" class="style5"> Welcome to
PotomacSouth.com where
you can leave your work and worries on the beach. Whether you
are
looking to get in on the fishing action Maryland and Virginia
waters
have to offer, or take a tour to one of our destinations via
the water
Potomac South can get you there. We offer tours of St. George
Island
and its surrounding waters including a look at what the local
fish nets
have caught, stop and see the Lighthouse, and two state
parks, Historic
St. Marys City, and Point Lookout. If food is on your
mind take an
evening cruise to catch a bite to eat at The Mooring
Restaurant. If you
have any questions or are interested in a trip today give
Captain Dan a
call or email through our Contact Us
link.</p>
</div>
<img src="
http://www.potomacsouth.com/Site-Top.jpg"
width="832"
height="558" /><br />
NOW FIND THE 'apDiv2' CSS IN THE HEAD SECTION OF YOUR PAGES
CODE AND
CHANGE THE 'LEFT' AND 'TOP' POSITIONING AS BELOW.
#apDiv2 {
position:absolute;
width:315px;
height:358px;
z-index:1;
left: 70px;
top: 160px;
overflow: auto;
THATS IT. IT SHOULD NOW MOVE AS YOUR BACKGROUND IMAGE MOVES

Dreamweaver layout - page height

I'm designing a Web site for a college course using a Dreamweaver layout - 2 column fixed, left sidebar, header and footer. When you use this layout, what is the height of my Web page? Does the height vary depending on the browser? Thanks in advance for any insight.

Height should remain flexible (unspecified) to accommodate varying amounts of content and increased text sizes.
If required, use the min-height property instead of height.
http://reference.sitepoint.com/css/min-height
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

Resizing div height using ExternalInterface makes window jump in safari

I only notice this problem in safari, no other browser.
My application loads in modules as it needs them and changes the height of the HTML div that contains the movie, I do this using ExternalInterface.call. (This is because scrolling in flex/flash is downright awful, I like the scrollbar in the browser to work).
However, If I load in a module and inside of that module I change the external interfaces height, I find that the flash movie seems to jump down then jump back up about 150-200 pixels.
I want the movie to just stay anchored to the top of the div, no matter what the size of the div is. How can I enforce that policy on the player?
I have tried align: "t" and salign: "t" in the movies params, but I'm not exactly sure what that did as it still jumped down.

hey, thanks for the direction. I'm guessing that when i styled the attribute, any existing css style for the object still overrid the attribute styling.
Here is a simple version of my solution:
<code>
function autoWide (myID, minWide) {
var targetA = document.getElementById(myID);
var currWidth = self.innerWidth;
if (currWidth < minWide) {
targetA.style.width = minWide;
else {
targetA.style.width = '100%';
</code>
If anyone else is interested the innerwidth method doesn't work in all browsers, here is a link to an explaination.
http://www.quirksmode.org/viewport/compatibility.html
thanks again.
G5 Mac OS X (10.4.6)

Dreamweaver AP DIV and Rollover Actions

New to Dreamweaver. Enviornment Win XP using DW CS4. I have created tables using rollovers but discovered that AP DIVS and rollovers don't always work as expected. Here is the problem. I have a menu column that is about 3 inches tall. The top porton of the menu is a tab that says "About Us." The lower portion of the column lists the menu items. I have the about us tab set up as a rollover. When you mouse over the tab, it is suppose to change color and the tab is suppose to move down about 1/4". Then when you actually click on the tab, you are taken to another web page. When I created this in a table, it was easy. I had two images. One image was set at the size of the td and when rolled over, the second image appeared in the different color and moved slightly down so as to give the appearance that the tab had moved down. However with the ap div, I can get the image to change color, but the smaller size image (to give the appearance of moving down), is actually stretched by the ap div to fit the size of the ap div box. Not at all what I expected. So it appears that an ap div behavior is in order but I am not sure how to accomplish this. I did not find any behavior that would resize the ap div box and move it down to the appropriate position. If you mouse out, it should return to the proper position, original size and return to the original color. Any ideas? A quick response would be appreciated. Thanks!

RM818 wrote:
A quick response would be appreciated. Thanks!
In that case, please cooperate by uploading your test files and posting a link as requested

How do I get fluid div height as % of width?

This question follows on from a different discussion I had but is on a different issue so apologies for starting a new thread.
I have a responsive layout with a header div which is set as a percentage of the screen width.
I have a background which is set to fill as cover.
This works great, but I need to maintain a ratio of something like 7:1
So is there a way of setting an equation in the css so that the height of the div is determined as something like:
height:12% of width;
Thanks
Terry

Ah, you've found some interesting css there.
Here's something fairly similar without the :before selector ...
<!doctype html>
<html lang="en-us">
<head>
<meta charset="utf-8">
<title>Responsive Header</title>
<style>
#wrapper {
    position: relative;
    width: 100%;
#aspect {
    padding-top: 18%;
#header {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: url(../img/refinery.jpg);
    background-size: 100% auto;
</style>
</head>
<body><div id="wrapper">
    <div id="aspect"></div>
    <div id="header">
        Your content here
    </div>
</div>
</body>
</html>

Loading SWF in Dreamweaver using DIV and Accordian

Hi
I am wanting to create a web page with a vertical navigation panel on the left of the page and because this will includes 'categories' and 'sub categories' (see below)
CATEGORY 1
sub category 1a
sub category 1b
sub category 1c
sub category 1d
sub category 1e
CATEGORY 2
sub category 2a
sub category 2b
sub category 2c
sub category 2e
Ideally I would want the Category tabs when clicked to reveal the sub categories (Accordian)
I have the Spry Accordian set in a Div at the moment in Dreamweaver and the sub categories
open up and function fine. What I would like to achieve is to make all those sub categories links, to insert a SWF in to the div that is located to the right of the vertical nav column. (see attachment simple diagram) So, say sub category 2a was clicked then in the 'SWF display area div', the SWF associated with that link would appear, the if 'sub category 2d' was clicked the same 'SWF area div' was populated with the SWF linked to 'sub category 2d', if 'sub category 2e' was clicked then the SWF associated with 'sub category 2e' would then load into the 'SWF area div'. The attached image may make things clearer.
Many thanks in advance for any assistance you can give me.

Hi
What you are talking about is an ajax enabled page, you can use html or xml using spry, (see - http://www.adobe.com/devnet/spry/)
Or any type of page php,asp, etc. using one of the javascript frameworks such as jQuery.
PZ

Dreamweaver adding local testing server MySQL-HELP REQUEST

I have a website on register.com and I am using MySQL for the
first time. My DB and table have been created using MyPHPAdmin. Now
I want to use my Dreamweaver to setup a testing server that will be
local and then upload asp pages after testing. Can Anyone PLEASE
assist with this. I have downloaded and installed MySQL 5 and
loaded the MySQL Driver for ODBC. I am not sure if I am doing this
correctly OR if anyone knows an easier way. In summary I simply
want to:
A : Be able to test MySQL tables using dreamweaver's testing
server then locally upload to my remote site that is hosted at
register.com.
THANKS in advance
Mark

Why not use PHPMyAdmin to build the database remotely and
then just use your
remote connection for testing?
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
==================
"Mark6372" <[email protected]> wrote in
message
news:eivg19$sdf$[email protected]..
>I have a website on register.com and I am using MySQL for
the first time.
>My DB
> and table have been created using MyPHPAdmin. Now I want
to use my
> Dreamweaver
> to setup a testing server that will be local and then
upload asp pages
> after
> testing. Can Anyone PLEASE assist with this. I have
downloaded and
> installed
> MySQL 5 and loaded the MySQL Driver for ODBC. I am not
sure if I am doing
> this
> correctly OR if anyone knows an easier way. In summary I
simply want to:
>
> A : Be able to test MySQL tables using dreamweaver's
testing server then
> locally upload to my remote site that is hosted at
register.com.
>
> THANKS in advance
> Mark
>

Inserting an image in dreamweaver through div tag

Hi I am inserting an image in a created div tag but my image is checkered and repeats it's self like a pattern. How do i turn that off?

Working with CSS Backgrounds:
http://www.w3schools.com/css/css_background.asp
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/

Dreamweaver adding div height in tooltip?

Similar Messages

Maybe you are looking for