# HTML help

**URL:** https://boards.straightdope.com/t/html-help/237785
**Category:** Factual Questions
**Created:** [April 1, 2004, 8:19pm UTC](https://boards.straightdope.com/t/html-help/237785 "2004-04-01T20:19:22Z")
**Posts on this page:** 6
**Page:** 1

<div class="post-metadata">

### Author: ![dotchan](https://avatars.discourse-cdn.com/v4/letter/d/9d8465/32.png) [@dotchan](https://boards.straightdope.com/u/dotchan)
#### Post date: [April 1, 2004, 8:19pm UTC](https://boards.straightdope.com/t/html-help/237785/1 "2004-04-01T20:19:22Z")

</div>

I’ve tried Google, I’ve tried SMDB, I’ve tried help files (shudder) and I’m about at my wit’s end.

What I’d _really_ like to do with my homepage in an effort to condense the content on some of my longer pages is something like this…

Q: Question 1  
Q: Question 2  
Q: Question 3

If a person browsing the site clicks on question 1, then the page does this:

Q: Question 1  
A: Answer 1

Q: Question 2  
Q: Question 3

I’ve tried using the “hide” style via Javascript, but all that does is make the text invisible; the space is still there. Does anyone know of a method to do what I’ve envisioned above? (Aside from the old “just make a new page” thing.)

---

<div class="post-metadata">

### Author: ![ReverseCowgirl](https://avatars.discourse-cdn.com/v4/letter/r/cc9497/32.png) [@ReverseCowgirl](https://boards.straightdope.com/u/ReverseCowgirl)
#### Post date: [April 1, 2004, 8:39pm UTC](https://boards.straightdope.com/t/html-help/237785/2 "2004-04-01T20:39:02Z")

</div>

You could probably adapt [this code](http://javascript.internet.com/foldertree/) pretty easily.

---

<div class="post-metadata">

### Author: ![ultrafilter](https://avatars.discourse-cdn.com/v4/letter/u/3d9bf3/32.png) [@ultrafilter](https://boards.straightdope.com/u/ultrafilter)
#### Post date: [April 1, 2004, 9:10pm UTC](https://boards.straightdope.com/t/html-help/237785/3 "2004-04-01T21:10:05Z")

</div>

The proper method to do this is with \<div\>\</div\> pairs. Search for a tutorial on that.

---

<div class="post-metadata">

### Author: ![ReverseCowgirl](https://avatars.discourse-cdn.com/v4/letter/r/cc9497/32.png) [@ReverseCowgirl](https://boards.straightdope.com/u/ReverseCowgirl)
#### Post date: [April 1, 2004, 9:27pm UTC](https://boards.straightdope.com/t/html-help/237785/4 "2004-04-01T21:27:12Z")

</div>

Here is a tutorial on that subject.

[http://hotwired.lycos.com/webmonkey/01/12/index1a.html?tw=authoring](http://hotwired.lycos.com/webmonkey/01/12/index1a.html?tw=authoring)

---

<div class="post-metadata">

### Author: ![Armilla](https://avatars.discourse-cdn.com/v4/letter/a/e19b73/32.png) [@Armilla](https://boards.straightdope.com/u/Armilla)
#### Post date: [April 1, 2004, 10:13pm UTC](https://boards.straightdope.com/t/html-help/237785/5 "2004-04-01T22:13:10Z")

</div>

You’re on the right track with the styles thing. What you need to do is access the “display” style. Set it to “none” to hide and collapse the element. Set it to “inline-block” to show it again.

---

<div class="post-metadata">

### Author: ![dotchan](https://avatars.discourse-cdn.com/v4/letter/d/9d8465/32.png) [@dotchan](https://boards.straightdope.com/u/dotchan)
#### Post date: [April 2, 2004, 6:18pm UTC](https://boards.straightdope.com/t/html-help/237785/6 "2004-04-02T18:18:31Z")

</div>

Thanks everyone. It’s working perfectly! 🙂
