Creative COW SIGN IN :: SPONSORS :: ADVERTISING :: ABOUT US :: CONTACT US
Creative COW's LinkedIn GroupCreative COW's Facebook PageCreative COW on TwitterCreative COW's Google+ PageCreative COW on YouTube
ADOBE DREAMWEAVER:HomeDreamweaver ForumDreamweaver TutorialsFAQAdobe FlashWeb Design

Dreamweaver, Window Size/Status Bar & Spry

COW Forums : Adobe Dreamweaver

<< PREVIOUS   •   FAQ   •   VIEW ALL   •   PRINT   •   NEXT >>
Share on Facebook
Jim EstnerDreamweaver, Window Size/Status Bar & Spry
by on Mar 19, 2008 at 8:12:56 pm

Just trying to figure out what I'm doing wrong here:

Created a background graphic in Illustrator (720x500) and then started a new page in Dreamweaver. First objective was to get the background in place. So I edited the CSS for the Body tag and entered in the PNG file, centered, fixed, no-repeat.

When I did this, the whole top of the background file is cut off in the Dreamweaver window (it shows up centered and in full in the browser preview). So I went to the "Set Magnification" drop-up box and tried to click "View All", but nothing happens. When I reduce the percentage, the background graphic gets lost on the top left of the screen (in other words, its not centered and still cut off). And when I try to change the window size in the Status Bar, I find all the dimensions greyed out.

By minimizing the properties & results menus down below, I was able to see almost all of the background. So I just dismissed the problem and continued on.

I then created a Spry Menu, which was placed top-left. I edited the CSS file and inserted some margin on the top and left so that it would show up in the area I needed it (per the background image). After getting it in place, I opened up my browsers (Opera & IE) to find that it still had a ways to go. But when I insert additional margin in Dreamweaver, it throws the Spry Menu into the middle of my background page (rather than the side).

Is there a way to (1) view the whole page I'm working on? What is going on? and (2) Why is there a disconnect between where I see the Spry menu in Dreamweaver & where it ends up on the browser?

Thanks a TON!!


Return to posts index
Reply   Like  

Abraham ChaffinRe: Dreamweaver, Window Size/Status Bar & Spry
by on Mar 19, 2008 at 10:01:46 pm

The problem it sounds like you are dealing with is you are trying to overlay your top content over your background image and they are not lining up. To have them line up when you are centering your background image, you must also center your top content and line it up that way.

The way Dreamweaver displays the content will definitely be different than the way the site appears in a browser. Additionally the site will look different from browser to browser. Complex alignment can be difficult so try and keep the factors you need to line up to a minimum, especially because of browser interpretation.

Firefox is also a very good browser to check with because of it's growing popularity.

Hope this helps,

Abraham


Return to posts index
Reply   Like  

Jim EstnerRe: Dreamweaver, Window Size/Status Bar & Spry
by on Mar 20, 2008 at 5:35:29 pm

You are correct in your interpretation.

When I open a panel window (CSS Window, Properties Windows) all of the Absolute Divs, Spry Menus, etc. all move, while the background stays where it is (although portions of it become invisible). (In other words, when I pull out the CSS Window Panel from the right hand side of the screen, everything I'm designing on the webpage itself shifts to the left. Likewise, when I pull up the Properties Window Panel from the bottom, everything on the actual page I'm designing (div tags, spry menus, etc.) get pushed upwards. As a result, everything I'm designing on the page gets all jumbled everywhere. Of course, when I preview in a browser, it looks like it should (or close to that of the page when the panels are minimized/hidden). Why is this? Is there a way in the program to show everything at a minimized ratio when pulling out a panel?

PS. Changing the % of the magnification does not do this. (Decreasing the magnification moves the background image to the top left corner of my screen and all of the CSS overlays are still jumbled up).


Return to posts index
Reply   Like  


Abraham ChaffinRe: Dreamweaver, Window Size/Status Bar & Spry
by on Mar 20, 2008 at 6:17:31 pm

Honestly I'm not sure why Dreamweaver does that but I'd imagine it has something to do with the way it's caching the display properties for the background image in the Dreamweaver program. The best solution for me has always been to not rely 100% on the design mode in Dreamweaver - I do a lot of previews in browser (F12) - especially when doing more sophisticated code.

I would imagine if you opened the panes you want open and then restarted the program or reopened the file it should reset the position of the background. Unfortunately this isn't much of a solution except for saying I believe you've found a glitch in the way Dreamweaver interprets background images.

Abraham


Return to posts index
Reply   Like  

Jim EstnerRe: Dreamweaver, Window Size/Status Bar & Spry
by on Mar 20, 2008 at 10:24:52 pm

Thanks for the responses!
Just to know that it appears to be a limitation is good information in itself.

When reading through Dreamweaver CS3 Missing Manuals - it talked about how people use a background with all the buttons and all in that background image - and then I suppose overlay a blank box over those buttons. Per what I'm seeing here - that doesn't seem a great idea (due to the laborious nature of positioning everything properly and then having it show up on each browser properly.) Do absolute div tags perhaps solve this? Or is the background image method frowned upon?

I am basically working on designing a page with a TV set type of layout (top, sides, and bottom are images and then the content would appear in the middle). Is it best to maybe just slice this all up and not post it as a background?

Thanks a bunch!


Return to posts index
Reply   Like  

<< PREVIOUS   •   VIEW ALL   •   PRINT   •   NEXT >>
Share on Facebook


FORUMSTUTORIALSMAGAZINESTOCKYARDVIDEOSPODCASTSEVENTSSERVICESNEWSLETTERNEWSBLOGS

Creative COW LinkedIn Group Creative COW Facebook Page Creative COW on Twitter
© 2013 CreativeCOW.net All rights are reserved. - Privacy Policy

[Top]