Topic: a little css help.... Pages that link to <a href="https://ozoneasylum.com/backlink?for=29132" title="Pages that link to Topic: a little css help...." rel="nofollow" >Topic: a little css help....\

 
Author Thread
Radical Rob
Bipolar (III) Inmate

From: Lost Angeles Kalifornia, via Hawaii....
Insane since: Jun 2001

IP logged posted posted 04-19-2007 21:19 Edit Quote

ok it's me again... i've been doing quite a bit of experimentation using css and thus far i'm really pleased with the results. now i'm taking the next step and going for a two column design. all my layouts thus far have been fairly simple. i've made several attempts but i seem to be botching the whole absolute, relative, placement thing....

I volunteered to redo my church website and thought it would be a great project to try this with. I've just created a psd of the layout first, haven't started slicing it yet... wanted to get some input first....

www.wayoutwestenterprises.com/clients/caicc/img/layout1.jpg

thanks!

reisio
Paranoid (IV) Inmate

From: Florida
Insane since: Mar 2005

IP logged posted posted 04-20-2007 01:12 Edit Quote

Looks fine.

Radical Rob
Bipolar (III) Inmate

From: Lost Angeles Kalifornia, via Hawaii....
Insane since: Jun 2001

IP logged posted posted 04-20-2007 04:13 Edit Quote

now I know u know that just a jpg of the layout.... :-D

Blaise
Paranoid (IV) Inmate

From: London
Insane since: Jun 2003

IP logged posted posted 04-20-2007 11:29 Edit Quote

There is very little if ANYTHING that you need to position absolutely or even relatively, the design is quite straight forward to markup correctly, and the CSS wouldn't take much to get right either.

If you are having problems though, let us know the specifics.

Cheers,

Radical Rob
Bipolar (III) Inmate

From: Lost Angeles Kalifornia, via Hawaii....
Insane since: Jun 2001

IP logged posted posted 04-23-2007 02:22 Edit Quote

Thanks Blaise,
Ok layed out the preliminary css here... www.wayoutwestenterprises.com/caicc/

wierd thing is, when i did it on my mac, the elements didn't have that extra space, but now im on a pc editing the css and there's padding somewhere thats messing it up...

The initial solution I couldn't figure out is how to make the content on the right box sit next to the content on the left box, allow a little margin for spacing and tidyness, and make it all clean.

As it is now, it wraps around the first column and looks wierd. Should I be giving the left column a specified height to avoid that problem?

thnx

Radical Rob
Bipolar (III) Inmate

From: Lost Angeles Kalifornia, via Hawaii....
Insane since: Jun 2001

IP logged posted posted 04-23-2007 07:25 Edit Quote

Ok I made another attempt at this... http://wayoutwestenterprises.com/caicc/index_v2.html

I just need to figure out how to repeat the bg image on the left column. Once I figure that out, I think I'm good.
Unless there's something I completely butchered.

thanks guys.

Suho1004
Maniac (V) Mad Librarian

From: Seoul, Korea
Insane since: Apr 2002

IP logged posted posted 04-23-2007 11:20 Edit Quote

No time to offer any helpful advice at the moment, but I will say two things:

1) The layout is busted in FF (the text extends beyond the white content area on both the left and right). When I get the chance I'll look at the code and see if I can figure out why.

2) The Gospel of Matthew is spelled with two 'T's and thus can never be abbreviated as "Math" (unless, of course, you are actually quoting from a mathematics textbook ). It is generally abbreviated as "Matt." or "Mt".


___________________________
Suho: www.liminality.org | Cell 270 | Sig Rotator | the Fellowship of Sup

Blaise
Paranoid (IV) Inmate

From: London
Insane since: Jun 2003

IP logged posted posted 04-23-2007 11:29 Edit Quote

How about making a bg image of the whole width of your content area (both columns) and having this repeat in your fauxColumns div, that way it doesn't matter which column is the deepest.

DL-44
Lunatic (VI) Inmate

From: under the bed
Insane since: Feb 2000

IP logged posted posted 04-23-2007 14:25 Edit Quote
quote:

Blaise said:

How about making a bg image of the whole width of your content area (both columns) and having this repeat in your fauxColumns div, that way it doesn't matter which column is the deepest.


that's the method I usually use, and the only one I've found that works.

Another step in breaking out of the obsolete table layout thought process!

Radical Rob
Bipolar (III) Inmate

From: Lost Angeles Kalifornia, via Hawaii....
Insane since: Jun 2001

IP logged posted posted 04-23-2007 17:41 Edit Quote

thanks suho.... my bad, that section is just a temporary area anyway. couldn't figure out how to bridge the gap between the header and body and keep the sides matching.

Thanks Blaise, i tried that initially with no success, after a bit of tampering with I got it.

Last thing though is my margins aren't working right for the right column... i adjusted the left column with no problems so the text doesn't bleed over on the the edges but the right column isn't playing nicely....

Blaise
Paranoid (IV) Inmate

From: London
Insane since: Jun 2003

IP logged posted posted 04-23-2007 18:03 Edit Quote

Well it looks like the width on your rightcolumn is set too high, I would set it to about 580px, with a right margin of about 10px,

But you'll probably want to change it a bit to go with your design ideal.

Hope this helps.

Radical Rob
Bipolar (III) Inmate

From: Lost Angeles Kalifornia, via Hawaii....
Insane since: Jun 2001

IP logged posted posted 04-23-2007 20:11 Edit Quote

sweet... adjusted and it seems to look fine now. (at least in FF)

Suho1004
Maniac (V) Mad Librarian

From: Seoul, Korea
Insane since: Apr 2002

IP logged posted posted 04-24-2007 01:47 Edit Quote

Ah, and just as I was about to pop back in and see if I could offer a hand, the problem has been fixed. Looks nice.

reisio
Paranoid (IV) Inmate

From: Florida
Insane since: Mar 2005

IP logged posted posted 04-24-2007 04:03 Edit Quote

http://css.maxdesign.com.au/listamatic/



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


« BackwardsOnwards »

Show Forum Drop Down Menu