Div expanding to fill whole screen

#1 08-31-2008, 12:32 PM

I have a page http://www.atishameditation.co.uk/faq.html that uses some CSS to
show / hide FAQ's.

My problem is the FAQ's are in a <div> and when the bottom question is
expanded the answer to that question fills the entire screen 'under the right
column'. I want to have the questions restricted to the width of my content not
including below the right column.

Does anyone know of a way to do this, I don't think that <div> can be
restricted by size? I have tried a <table> within the <div>, but this isn't
allowed!

Maybe there's something that I havn't thought about?

#2 08-31-2008, 12:52 PM

The right column is floated, but your main column is neither defined nor
floated. You need to introduce an adjacent DIV to contain your main content
(including the FAQ list) assign it a width, and then float it.

--
Al Sparber - PVII
http://www.projectseven.com
Fully Automated Menu Systems | Galleries | Widgets
http://www.projectseven.com/go/Elevators

"Pakman36" <webforumsuser@macromedia.com> wrote in message
news:g9eh2o$p6p$1@forums.macromedia.com...
>I have a page http://www.atishameditation.co.uk/faq.html that uses some CSS
>to
> show / hide FAQ's.
>
> My problem is the FAQ's are in a <div> and when the bottom question is
> expanded the answer to that question fills the entire screen 'under the
> right
> column'. I want to have the questions restricted to the width of my
> content not
> including below the right column.
>
> Does anyone know of a way to do this, I don't think that <div> can be
> restricted by size? I have tried a <table> within the <div>, but this
> isn't
> allowed!
>
> Maybe there's something that I havn't thought about?
>

#3 08-31-2008, 01:38 PM

Hi Al, the FAQ page is working through the kindeness of PVII (great stuff).
Good to actually be in communication with the Gurus themselves!

What exactly do I need to do?, do I fix the right column so it only appears on
the right? The content is included in a div as far as I remember

#4 08-31-2008, 04:13 PM

See if this quick example helps:
http://www.projectseven.com/testing/customers/pakman/

--
Al Sparber - PVII
http://www.projectseven.com
Fully Automated Menu Systems | Galleries | Widgets
http://www.projectseven.com/go/Elevators

"Pakman36" <webforumsuser@macromedia.com> wrote in message
news:g9ekug$t1b$1@forums.macromedia.com...
> Hi Al, the FAQ page is working through the kindeness of PVII (great
> stuff).
> Good to actually be in communication with the Gurus themselves!
>
> What exactly do I need to do?, do I fix the right column so it only
> appears on
> the right? The content is included in a div as far as I remember
>

#5 08-31-2008, 05:00 PM

Hi Al, wow that works great, I'm not sure where to start with the CSS code?

My main body (#content) is floated left and my right column is floated right,
you said that my main column is neither defined nor
floated? Would it not work if I fixed #content was fixed left rather than
floated? I still at the early stage of my CSS learning curve

#6 08-31-2008, 05:22 PM

"Pakman36" <webforumsuser@macromedia.com> wrote in message
news:g9f0qa$bhd$1@forums.macromedia.com...
> Hi Al, wow that works great, I'm not sure where to start with the CSS
> code?
>
> My main body (#content) is floated left and my right column is floated
> right,
> you said that my main column is neither defined nor
> floated?

There is no <div id="content"> in your document.

> Would it not work if I fixed #content was fixed left rather than
> floated?

No. Fixed would lock it in place and you'd lose whatever did not fit in the
window.

> I still at the early stage of my CSS learning curve

We all started somewhere. It takes time.

It would be best to redo the page if you can.

--
Al Sparber - PVII
http://www.projectseven.com
Fully Automated Menu Systems | Galleries | Widgets
http://www.projectseven.com/go/Elevators

#7 09-02-2008, 11:07 AM

Hi Al
My other pages have a <div id="content"> I thought that my FAQ page had
e=because it's based on the same template?

If I add the ID into my div on the FAQ page would it then work? with the final
question not filling the right column area?

#8 09-02-2008, 11:23 AM

Is that div in an EDITABLE region of the Template? If so, it may not be
present any given page, depending on when the div was added to the Template
code, and when the child page was spawned.

--
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
==================

"Pakman36" <webforumsuser@macromedia.com> wrote in message
news:g9jkr4$e0p$1@forums.macromedia.com...
> Hi Al
> My other pages have a <div id="content"> I thought that my FAQ page had
> e=because it's based on the same template?
>
> If I add the ID into my div on the FAQ page would it then work? with the
> final
> question not filling the right column area?
>
>
>

#9 09-02-2008, 03:45 PM

Hi Murray, good to here from you.

My <div> is in an editable region, that has been there since the template was
made. It's on all the other pages that have been based on the template, not
sure how it isn't on my FAQ page? I will try to add the div ID to that page to
see if it helps.
Pakman36

#10 09-02-2008, 04:11 PM

Hi Murray and Al

I have added my 'div ID =content' to my FAQ page and it works great, the final
question is contained within the boundary of the content and doesn't overlap
the right border.

One further problem with the page is the <h2> are not appearing in the correct
color of #6D3424, but #454f6f which is the color of my <p> and my links. I'm
assuming it's some sort of CSS conflict, but can't figure where it's going
wrong?

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode