CSS table problem

  • futurebuzz
  • Student
  • Student
  • User avatar
  • Posts: 75
  • Loc: Birmingham England

Post 3+ Months Ago

Hello,

Is there any way that i can create a table with css that will fit the whole of my site?

At the moment i have to create a different code for the tables because all the heights are different on each page

Home page is: height:450px

Photo page is: height:690px

etc etc

Thanks
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • rtm223
  • Mastermind
  • Mastermind
  • User avatar
  • Posts: 1855
  • Loc: Uk

Post 3+ Months Ago

are you wanting to have the table expand vertically?

If so, don't specify a height. The table should expand to hold the content.

I never specify height unless I really have to.
  • futurebuzz
  • Student
  • Student
  • User avatar
  • Posts: 75
  • Loc: Birmingham England

Post 3+ Months Ago

Yeah that's exactly what i'm trying to do!

OK, i'll see if it works...

Cheers!

[EDIT]

Just tried it. It don't work for me! Is there any chance you could have a quick look at one of the pages?

http://www.futurecorps.net/Home_Page.htm

Ta...
  • rtm223
  • Mastermind
  • Mastermind
  • User avatar
  • Posts: 1855
  • Loc: Uk

Post 3+ Months Ago

//before I post, assumtions:
//you are creating a pure css layout
//you are postioning absolutely

//if those are wrong, correct me.



ah.....
This would be the situation where you want the content to expand it's div and the other divs to expand with it? This is a downside of the css layout, and means you have to get creative. Dont panic, it can be done. it's hard to describe without showing you. l work out how, then get back to you. :D
  • rtm223
  • Mastermind
  • Mastermind
  • User avatar
  • Posts: 1855
  • Loc: Uk

Post 3+ Months Ago

ok, I have uploaded a diagram of your front page (mostly so I can colour code it so we all know what part I am talking about. You will have to copy/paste the url as it's on geocities.

http://www.geocities.com/whataloadof_cr ... rebuzz.gif

red section - this will never move with the content - leave it as it is.
blue section - this will expand and collapse as necessary
green section - this does not move with the content, but needs to
Tricky section - this is a problem, and my solution resorts to an additional div to sort out this area.

1) back up all of your files :D oh how many times I skipped that step

2)remove everything but the red section from the page

3)create a new div, position it below the title section with the left at the left of the page (point x)

4) set the width of this div so that it covers the whole page (the white dotted line is going to show this div). Do not set it's height.

5) place the content div (blue) nested in the new div. Give it a large left margin so it does not cover up the menu. This div is no longer absolutely postioned - and you do not need to give it any dimensions. The width will fill the container, and the height will match the content.

6) now place the footer element below the content, nested inside the dotted line div. It too will not need a width and is not absolutely positioned. It will sit below the content as the content expands and collapses.

So far the containing div has not been neccesary, but it is there to provide us with the tricky section, which you can now make stretch down the left hand side by making it a background image, with repeat-y.

This should work, however the container/dotted line div may get hide the menu. If this happens move the markup for the menu below the container in the html file, and it will display over the top.

This will work but will need some tweaking of distances to get it spot on. Good luck :)
  • futurebuzz
  • Student
  • Student
  • User avatar
  • Posts: 75
  • Loc: Birmingham England

Post 3+ Months Ago

Hi rtm 223,

Wanna say thanks for your efforts!! I will look and work with what you have done after work on Monday.

I've downloaded the gif and thats exactly what i want to do!

Need to spend some time with the family, i've been on ere the whole weekend :shock:

Thanks again!

[EDIT]

Second thoughts....


I have tried my best. I seem to have the width sorted out but not the height...grrr!

See what you think.

http://www.futurecorps.net/TESTING.htm
  • rtm223
  • Mastermind
  • Mastermind
  • User avatar
  • Posts: 1855
  • Loc: Uk

Post 3+ Months Ago

Sorry I didn't read your edit - you should have posted again it would have got my attention lol!

Right:

I have got started and added some whitespace to your code so I can understand it better. I'm now working on shifting that bottom section

BTW nice use of bulletpoints at the top and bottom :wink: - I saw that somewhere before and totally forgot about it lol, thanks for reminding me :D
  • futurebuzz
  • Student
  • Student
  • User avatar
  • Posts: 75
  • Loc: Birmingham England

Post 3+ Months Ago

Hey, i thought you'd forgotten about me :cry:

Yeah, i was thinking about posting again. I normally wait for an e-mail for the notification of replies. Sometimes they're late etc...

Looking forward to the fixing of the table... 8)

The bullets came from the menu at the top of my home page: I looked at the html and noticed the ► ◀ ◆ arrows and shapes

I made a search and came up with this site: http://homepage1.nifty.com/nomenclator/ ... eometr.htm

Post Information

  • Total Posts in this topic: 8 posts
  • Users browsing this forum: No registered users and 54 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
cron
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.