I've decided to finally learn how to code in CSS, and tonight was my first try. I seemed to have gotten it down, or atleast I had thought. The site looks exactly how I want it to in IE on a 1024x res. But in a lower res, or in Firefox, I am getting problems. I really don't know much of what I'm doing right now, since like I said - I'm new to CSS. With that said, could anyone possibly look at the code and help me out a bit here?

Link

Look at it in IE, then in Firefox .. you'll see.

Thanks,
Larry.

Larry, You must have resolved your problem.

I tested your page in IE, Netscape 6.3, Opera 7.21 and Firefox 0.93. All displays look the same.

The problem looks like you have designed it in 1024x768 using layers... Therefore when you resize the browser the layers will move..

Examples..

1280x1024 [Gone!]
800x600 [Gone!]

--James

<edit>Images Removed no longer on my site</edit>

Originally Posted by JohnJ

Larry, You must have resolved your problem.

I tested your page in IE, Netscape 6.3, Opera 7.21 and Firefox 0.93. All displays look the same.

Hmm... for me, I am missing the borders around the tables, and the main content box is off line.

Avant/IE: http://lvance.freeunixhost.com/cwoavant.jpg

Firefox: http://lvance.freeunixhost.com/cwofox.jpg

Originally Posted by Dark-Skys99

The problem looks like you have designed it in 1024x768 using layers... Therefore when you resize the browser the layers will move..

I see. Is there a way to accomplish what I did in another form of CSS?

Update: I fixed it to where it looks the same in both browsers now.

I still have the resolution problem, but that doesn't bother me that much.

The problem with Netscape and Firefox is that it doesnt support the 'border' variable in css..

I think '-moz-border' works.. Although Im not sure on that..
This should help.. http://www.blooberry.com/indexdot/cs...extensions.htm

The only other way I can know of doing it would be using tables and you can then use css to set the widths, colors etc.

--James

I don't have netscape, but I use firefox. The borders are now showing up for me, are they not in Netscape?

Yea the borders are working fine in Netscape now

--James

Hey, question ...

	#frame {
		width:744px;
		height:750px;
		margin-right:auto;
		margin-left:auto;
		margin-top:10px;
		padding:0px;
		text-align:left;
		background-image:
		url('images/midbg.jpg')
		}

I tried changing that to "100%" but it doesn't work. How can I have a varible of 100% for the height of that area?

I think the way to solve it is also assigning the height:100% to the body aswell..

Example..

body {
height:100%;
}

#frame {
		width:744px;
		height:100%;
		margin-right:auto;
		margin-left:auto;
		margin-top:10px;
		padding:0px;
		text-align:left;
		background-image:
		url('images/midbg.jpg')
		}

Hope this helps
--James

Does seem to be working.

http://lvance.freeunixhost.com/CWO/csstest.shtml

Its working fine for me in IE but its just a little too big so maybe change the height in the body to 95%.. Or also chnage the margins..

body {
margin-top:0;
margin-bottom:0;
}

Also you have to remember even if you set the height as 100% if the content is bigger the height will increase anyway

--James

Still doesn't stretch 100% for me in IE, and it's very small in Firefox. Simply not working.

http://lvance.freeunixhost.com/CWO/csstest.shtml

I was thinking before you just wanted the main background 100%..

But I guess you mean you want the content table 100%..

In that case..

Adding the height:100%; to #contentcenter should work..

--James

I'm wanting #frame to be 100%, which uses this background: http://lvance.freeunixhost.com/CWO/images/midbg.jpg

I want that background to stretch to the bottom.

Originally Posted by LVance

I want that background to stretch to the bottom.

Stretchs fine for me in IE when I resize the window

--James