Topic: fluid width in one column and also 100% height. Pages that link to <a href="https://ozoneasylum.com/backlink?for=26484" title="Pages that link to Topic: fluid width in one column and also 100% height." rel="nofollow" >Topic: fluid width in one column and also 100% height.\

 
Author Thread
Pugzly
Paranoid (IV) Inmate

From: 127.0.0.1
Insane since: Apr 2000

IP logged posted posted 08-19-2005 23:06 Edit Quote

I present to you a page that has a little "issue". I'm trying to get the map div (#map) to fill the width of the parent div (#innerContentColumn). It needs to be fluid so resizing isn't an issue. But everything I've tried is just ALMOST enough, but not quite. I'm sure I'm close, but....

CSS is in simple.css and complex.css

Help? :-(

BTW - I'm already aware of the IE issue with the left side border. I'll figure that out later.

bitdamaged
Maniac (V) Mad Scientist

From: 100101010011 <-- right about here
Insane since: Mar 2000

IP logged posted posted 08-20-2005 01:15 Edit Quote

Hmm that page is breaking for me but usually if I want an inner div to fit a parent I just set the margins to 0 and it fills it.



.:[ Never resist a perfect moment ]:.

reisio
Paranoid (IV) Inmate

From: Florida
Insane since: Mar 2005

IP logged posted posted 08-20-2005 01:46 Edit Quote

Um...don't set its width to 400px and it will expand.

Pugzly
Paranoid (IV) Inmate

From: 127.0.0.1
Insane since: Apr 2000

IP logged posted posted 08-21-2005 01:43 Edit Quote

reisio - I was having a problem getting it to display at all, so that's why the 400px was put in there. I did get it to expand, but I'm still having an issue with getting it to do height: 100%; I'm thinking I'm just going to have to hard code it and leave it that way.

Slime
Lunatic (VI) Mad Scientist

From: Massachusetts, USA
Insane since: Mar 2000

IP logged posted posted 08-21-2005 01:55 Edit Quote

Haha, I *love* the copyright notice. What is it you're doing here? It looks like you've found a way to make the google maps API take an address instead of just coordinates?

It looks like when you get too wide, the map doesn't fill in all the way on the right side.

100% height with CSS has always been difficult, and is generally faked with background images. You might consider scripting it.


 

Pugzly
Paranoid (IV) Inmate

From: 127.0.0.1
Insane since: Apr 2000

IP logged posted posted 08-21-2005 04:51 Edit Quote

Actually, I do feed the map latitude & longitude coordinates. I use a SOAP call to geocoder.us to convert a street address to coordinates, and then plot the map. There are a ton of things that you don't see yet.

I was hoping I wouldn't have to script it, but it looks like I might have to.

reisio
Paranoid (IV) Inmate

From: Florida
Insane since: Mar 2005

IP logged posted posted 08-21-2005 06:05 Edit Quote

Ah okay - I'll get back to this later tonight or tomorrow when I get up.

reisio
Paranoid (IV) Inmate

From: Florida
Insane since: Mar 2005

IP logged posted posted 08-23-2005 02:58 Edit Quote

Huh, I thought I'd post this already but apparently not...

Is the XML declaration important to you? Do you want this to work in IE?

(Edited by reisio on 08-23-2005 03:07)

Pugzly
Paranoid (IV) Inmate

From: 127.0.0.1
Insane since: Apr 2000

IP logged posted posted 08-23-2005 20:28 Edit Quote

Yeah, the XML declaration is important. I'd prefer to serve as XHTML 1.1 as application/xhtml+xml

I've noticed, while working on this, that if I do something like

body,html {height: 100%;}
#map {height: 100%;}

it will work fine IF there is no DOCTYPE defined. As soon as I define either an XHTML 1.0 or XHTML 1.1 DOCTYPE, it no longer works, and I end up with a div that's two pixels high (top & bottom border).

Ideas? I've been working on this for a while. I'd prefer to use a DOCTYPE.



(Edited by Pugzly on 08-23-2005 20:30)



Post Reply
 
Your User Name:
Your Password:
Login Options:
 
Your Text:
Loading...
Options:


« BackwardsOnwards »

Show Forum Drop Down Menu