# dreamweaver help



## woody382 (Oct 29, 2007)

hi,

I wonder if you can help me please. I've designed a website using dreamweaver and i've used the Ap div to place tables and headings on the page which i designed using photoshop.

i then bought a laptop and transfered all the website files to it, but when i view it on the 
17" monitor of the laptop, all the tables and heading have moved and not in the place i place them on the original computer, which had a 19" monitor. 

Is there anyway I can solve the problem so that the table etc. i placed on the page using dreamweavers Ap div remain in the same place if viewed on any size monitor.

thanks for your advice.


----------



## Susie N (Mar 22, 2003)

Do you have the page online? I think it might be easier if we could see the exact problem and examine the code.


----------



## woody382 (Oct 29, 2007)

hi,
sorry, it's not online as i have not got to that stage as yet. i'm still designing the pages.

I can reposition the tables by moving them back into place, but i doubt they will stay in the same postion if view it on the 19" monitor.

is there anything you can think it could be?

thanks for your help


----------



## tomdkat (May 6, 2006)

There's not much we can do without seeing the HTML. Please either post the *complete* HTML in this thread or host the site on a server and post a link to it. 

Thanks!

Peace...


----------



## woody382 (Oct 29, 2007)

Here is one of the Ap div i used which changed alignment when viewed on a 19" monitor and a 17" monitor.

From looking at the page, I centered the page is designed in photoshop by changing the html code to centre and everything aligned ok. But when viewed on the 17" laptop the page is still centered ok, but the Ap Divs seems to have kept the same distance from the left size of the screen as it did on the 19" monitor

here is the code for the ap Div:

welcome to my website.

thanks


----------



## woody382 (Oct 29, 2007)

Hi, from looking at the page again, it seems as though the alignment of the Ap divs change when viewed on different resolution screens. How can I over come this. Here if the html code for the Ap div.

welcome to my website.


----------



## tomdkat (May 6, 2006)

tomdkat said:


> There's not much we can do without seeing the HTML. Please either post the *complete* HTML in this thread or host the site on a server and post a link to it.
> 
> Thanks!
> 
> Peace...


 We need to see the HTML for the entire page. If you're using external CSS files, we'll need to see those too. 

Peace...


----------



## woody382 (Oct 29, 2007)

Hi all i finally figured out what was going on with my site. thanks for all the advice. Here is the problem i can't seem to resolve.

I designed my webpage in photoshop and sliced it for web ready to use on dreamweaver. The page looks fine on dreamweaver and also in a test browser. I then need to add Ap Divs so that i can place table, images and titles where i want them on the page.

When i absolute position the ap divs in dreamweaver it looks great and also in the browser, but if i change the size of the page in the browser the alignment changes for the ap divs, so they seem to move around depending on the size of the page. I therefore figured out that I need to use static ap divs and use the margins elements to place the ap divs. On testing it worked fine. 

HERE'S THE PROBLEM:

If i place a static Ap Div over a sliced page in dreamweaver it places the Ap Div inbetween the slices instead of over the the page. From closer investigation the margins of the Ap div pushes the slices apart to fit in position.

Is there anyway i can place static Ap divs on a sliced page, which in affect using the margins, but doesn't affect the slices.

i hope you can help with this problem.

cheers


----------



## Cookiegal (Aug 27, 2003)

I've merged one of your new threads here and deleted the other two. Please do not start multiple threads for the same issue.


----------



## Fyzbo (Feb 6, 2002)

Does ap div stand for absolute positioned div? I've never heard the term ap div before.

Using tools to generate code without understanding the code will almost always cause trouble. I think that's why many developers here at TSG code by hand rather then using wysiwyg. I don't use dreamweaver, but if you post your code for the page (in it's entirety) perhaps I can help. My best advice however would be to stop using dreamweaver and start over with notepad2.


----------



## woody382 (Oct 29, 2007)

here is all my code for the page. As you can see the picture in the static positioning doesn't overlay the background i created.

Example page



























 































 















































































































































 































 































 























 































 















 























 















 























 















 


----------



## Fyzbo (Feb 6, 2002)

#apDiv1 {
position:*absolute*;
width:806px;
height:608px;
z-index:1;
left: 181px;
top: 217px;
}


----------



## woody382 (Oct 29, 2007)

changing position to absolute doesn't keep the div central in all screen resolutions and changing it to static it places itself inbetween the sclices.

cheers


----------



## Fyzbo (Feb 6, 2002)

What do you meant by central in all screen resolutions?


----------



## Fyzbo (Feb 6, 2002)

I can't see the images and the alt tags are not filled in so I don't know their content. I'm going to make a lot of assumptions so don't blame me if I'm wrong. Example-Page_37.gif is actually supposed to be a background for the page content and that is why you want apDiv1 to sit on top of it. The best way to do this is to set Example-Page_37.gif as a background-image in the css, this way other content can be placed over it without any positioning.


```
Example page


[TABLE]
[TR]
[TD]
[IMG alt=""]images/Example-page_01.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_02.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/spacer.gif[/IMG][/TD]
[/TR]
[TR]
[TD]
[IMG alt=""]images/Example-page_03.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_04.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_05.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/spacer.gif[/IMG][/TD]
[/TR]
[TR]
[TD]
[IMG alt=""]images/Example-page_06.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_07.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_08.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_09.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_10.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_11.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_12.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_13.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_14.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_15.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/spacer.gif[/IMG][/TD]
[/TR]
[TR]
[TD]
[IMG alt=""]images/Example-page_16.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_17.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_18.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_19.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_20.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_21.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/spacer.gif[/IMG][/TD]
[/TR]
[TR]
[TD]
[IMG alt=""]images/Example-page_22.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_23.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_24.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/spacer.gif[/IMG][/TD]
[/TR]
[TR]
[TD]
[IMG alt=""]images/Example-page_25.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_26.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_27.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/spacer.gif[/IMG][/TD]
[/TR]
[TR]
[TD]
[IMG alt=""]images/Example-page_28.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_29.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/spacer.gif[/IMG][/TD]
[/TR]
[TR]
[TD]
[IMG alt=""]images/Example-page_30.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_31.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_32.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/spacer.gif[/IMG][/TD]
[/TR]
[TR]
[TD]
[IMG alt=""]images/Example-page_33.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/spacer.gif[/IMG][/TD]
[/TR]
[TR]
[TD]
[IMG alt=""]images/Example-page_34.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/Example-page_35.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/spacer.gif[/IMG][/TD]
[/TR]
[TR]
[TD]
[IMG alt=""]images/Example-page_36.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/spacer.gif[/IMG][/TD]
[/TR]
[TR]
[TD]
[IMG]../../All Users/Documents/My Pictures/Sample Pictures/Blue hills.jpg[/IMG][/TD]
[TD]
[IMG alt=""]images/spacer.gif[/IMG][/TD]
[/TR]
[TR]
[TD]
[IMG alt=""]images/Example-page_38.gif[/IMG][/TD]
[TD]
[IMG alt=""]images/spacer.gif[/IMG][/TD]
[/TR]
[/TABLE]
```
To be rude, but honest, this code is not good. Spacer gifs are bad practice and completely unnecessary when using css. They are a throwback to the 90's when there was no css. Also table layouts and slicing images can cause many problems. ImageReady may have made it easy to generate html, but the html sucks. I would really suggest taking some time to learn html/css and then coding the page by hand.


----------



## woody382 (Oct 29, 2007)

Thanks for the reply, i'll try to do what you mentioned and i'll let you know if it works. Being new to web design it seemed like dreamweaver was the best way to design websites. I think i'll start learning coding and use it together with dreamweaver. Do you know of any good free online places to learn how to code or should i buy the books.

cheers


----------



## woody382 (Oct 29, 2007)

Hi, thanks for all the help. I got rid of the spacer gif and learnt a bit of code. Solved the problem buy making the background in dreamweaver then placing a static position where i wanted it. All works well now and problem finally solved.

thanks again for all the help.

Cheers


----------



## JannMirch (Jan 10, 2008)

I'm glad you figured out your solution. 

Dreamweaver is a very convenient package to work on your HTML/CSS and still get a preview of what you are doing. Of course, you still need to view your pages in many different browsers to make sure they render correctly.

Some great sources for learning CSS/HTML:
csszengarden.com
alistapart.com

I would suggest you don't start learning to design your webpages using tables. You will only end up unlearning it and going to a table-less design using CSS. Tool around csszengarden, copy and paste the HTML and CSS codes into sample pages in Dreamweaver to get a sense of how they work and you'll be on your way.


----------

