Member Avatar for Takes Time

Hey all,
Im from Monterey, CA and new to the site. I was hoping someone could offer me some help in basic dreamweaver. I was curious as to how I would go about making my page expandable and collapseable with the browser window.. HELP!
Thanks in advance,
-rj

  • 5 Contributors
  • 4 Replies
  • 93 Views
  • 3 Weeks Discussion Span
  • Latest Post Latest Post by Member #114696

Dani AI

Generated

Two common things people mean by "expandable/collapsible with the browser window" — either the whole page should resize fluidly as the window changes, or specific sections should collapse/reflow at narrower widths. Both are handled with CSS (and a little JS only for interactive toggles); Dreamweaver is just the editor that writes the code, so focus on the markup and styles first.

A simple, modern approach: use a fluid container with a sensible max-width, flexible images, and a layout system (flexbox or grid) that allows columns to wrap. Example CSS patterns to drop into your stylesheet:

html, body { margin: 0; box-sizing: border-box; }
*, *:before, *:after { box-sizing: inherit; }

.container { width: 90%; max-width: 1200px; margin: 0 auto; }

img, video { max-width: 100%; height: auto; }

.row { display: flex; flex-wrap: wrap; }
.col { flex: 1 1 300px; padding: 10px; }

@media (max-width: 600px) {
  .col { flex-basis: 100%; }
}

For collapsible content you can use the native HTML5 element details/summary for a quick no-JS solution, or add a small toggle script for older browsers or fancier animations:

<details>
  <summary>Section title</summary>
  <p>Hidden content that expands when window is small or user clicks.</p>
</details>

Practical Dreamweaver workflow and troubleshooting: work in Code view or Live View and keep styles in an external CSS file. Ensure a standards DOCTYPE so browsers behave predictably. Watch for fixed-width elements (tables, images, absolute positioned blocks) — they break a fluid layout. Percentage heights need parent heights defined (use html, body { height:100% } if you must). Test across browsers and resize the viewport to catch overflow and wrapping issues. As and pointed out, the technique lives in the CSS, not Dreamweaver; ’s links and ’s suggestion to read documentation are useful starting points, but apply the code patterns above to get the behavior you want.

Recommended Answers

All 4 Replies

Member Avatar for tgreer

I know nothing about Dreamweaver. In HTML, in general when you wish your page's content to expand/contract, you use percentage values rather than fixed units when you size your elements.

Member Avatar for FC Jamison

Yeah...it has nothing to do with Dreamweaver.

Member Avatar for Member #114696

first read the whole documentation provided by the company

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.