Known Participant

Question

Most Recent Version of DW w/ (true) WYSIWYG

Forum|Forum|7 years ago
April 1, 2018
4 replies
556 views

hello...

Working in Macromedia DW 2004...obviously need to upgrade. Downloaded CC 2018 trial version, only to find it's no longer a true WYSIWYG app.

I design by 'drawing' layers (divs), not by having to place them strategically in the code...I design like a graphic illustrator would; & then fine tune the whole business in Code View. [& that newest version is also missing different ways to manipulate text (e.g., italic, bold, font size, etc.) easily].

So...unless I'm missing something here...& there is indeed a simple 'Insert Layer' button somewhere I've failed to pick up on...can someone please tell me when this function was thrown out (so I can get the previous year's release)?

thanx,

dox

This topic has been closed for replies.

M

markf26988182Author

Known Participant

FOLLOW-UP to Original Post (#3)...

I guess what I should be asking is this: How would I create a simple page...using both HTML & CSS...that would flow correctly in all browsers & devices...& look like the following:

(whereby the block represented by the thick black line is always centered...& the other blocks (text & images) remain inside the centered block)...

thanx,

dox

btw...looking for an informational on the web that will instruct me how to do this...not for someone to do my homework for me (on the other hand...if your inclined to whip up some quick code...feel free; & it will be greatly appreciated)

pziecina

Legend

O/k, I won't do your homework for you, but what you are looking for is called css flexbox layouts -

https://css-tricks.com/snippets/css/a-guide-to-flexbox/

M

markf26988182Author

Known Participant

OK...fair enough...thanx...

Most all of my designs account for all that, tho...I create a parent div which has 'relative' positioning (always centered)...& my 'absolute' positioning divs nest inside that (where the nest snippets are tabbed two spaces to the right)...so the code sorta looks lilke:

[HTML]

</div>

[/HTML]

& I've never has any problems w/ different screen resolutions or resizing.

But I guess my real question would now be...in accordance w/ my above method...how can I now position my text & images quickly/effectively in CC 2018 without using APdivs...??? I know the answer lies with CSS, but is there an informational somewhere that shows me how to do this quickly by manipulating the code...OR...even better yet...is there some CSS command/function in CC 2018 that sets it up?

thanx,

dox

BenPleysier

Community Expert

To reluctantly answer your question. I have added background colours to show the result.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
  <style>
    #Parent {
      position: relative;
      width: 840px;
      height: 4000px;
      margin: auto;
      background-color: cadetblue;
    }
    #Nest1 {
      position:absolute; 
      left:0px; 
      top:0px; 
      width:640px; 
      height:132px; 
      z-index:1;
      background-color: yellowgreen;
    }
    #Nest2 {
      position:absolute; 
      left:3px; 
      top:3px; 
      width:194px; 
      height:150px; 
      z-index:1;
    }
    #Nest2 img {
      width: 194px;
      height: 150px;
    }
  </style>
</head>
<body>
  <div id="Parent">
    <div id="Nest1"></div>
    <div id="Nest2"><img src="http://lorempixel.com/output/nightlife-q-c-199-153-1.jpg" width="199" height="153" alt="Such and Such"></div>
  </div>
</body>
</html>

I hope that you have noticed the vertical scroll bar to nothing and the horizontal scrollbar when I reduce the window size to less than 840px as is the case for mobile devices.

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!

Nancy OShea

Community Expert

You've been using outdated software and web design methods for so long, you missed the train. It left the station about 10 years ago. See this related thread.

layout and ap div in Dreamweaver CC

Modern, responsive web design is not possible with so-called Layers or APDivs. Those inserts were removed from DW several years ago. Nowadays, we use CSS and media queries for optimal viewing on mobile, tablet and desktops. This is NOT click & drag web design.

If you open your page in Live view (see screenshot), you will have a more accurate rendering of your work -because it uses a Chrome embedded framework. However, previewing in all modern browsers and mobile devices is still the most reliable way of testing your page layouts.

Nancy O'Shea— Product User & Community Expert

ALsp

Legend

There was never really a true WYSIWYG Dreamweaver. Dreamweaver, even the latest version, does not fully support CSS (the single design language of the web) so what you want is actually impossible. You can get a facsimile, and then you can rely on browser preview or live view. The other issue here is that drawing layers (which do not actually exist) is kind of like taking a Model T out on the autobahn. If you do not know CSS and basic HTML markup, and you want a web page that will work in all modern devices, then you must use either a canned web page service, where you pick an online template and have limited control over simple edits. Or you can use Dreamweaver extensions to install page building tools. The bottom line is that it requires an investment:

1. Your time to learn basic coding

2. Your money to buy one or more tools to install into Dreamweaver.

There are no other choices that won't cause a lot of pain.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded