Topic: Problem with CSS and Redoign a Site (Page 1 of 1)

The current site is sitting here: http://www.stonybrook.edu/stuaff/handbook/

My job is to make that page a CSS2 and XHTML compliant, so I am doing it in the no using tables way. The problem I am running into is with the menu. Take a look here: http://www.stonybrook.edu/stuaff/tests/index.html

If you have any ideas please let me know.

yes, I remember Michael and I having problems with getting the height of something to fill 100%... I don't believe we found a solution to it I know that if you said height="100%" in a table it would work, but you can't use tables I guess. If I find anything I'll be sure to post it - hopefully someone else here has some actual solution.

Yeah, some of these things that can be done so easily with a table can be really hard to reproduce with CSS only.

One thing you might try is putting a big container div around your menu and content area and assign the border and background to that container instead of the menu. I guess you could leave the menu and content divs almost like they are now then, but you won't need the borders around them anymore except for the one on left side of the content div.

Hope that makes some sense...

kuckus (cell #282)

kuckus: The idea for an additional container works... I wanted to find a way around this, but I guess that is not possible.

Could you check the page again, there is another error.

in the #content section I have the border set to 1px solid #f90. Now I want to change it so that the top and bottom don't have a border (notice that it doesn't line up. So.. if I set the border to 0px solid #f90. or if I only set the left and right border I get a huge margin on the top and bottom of the content and menu section. I don't know why this is happening.

Any ideas?

seems to me the width 100% part is your problem with #centerContainer

you have a margin making it go 100px to the left and right.
It will of course ignore the right with a 100% width which makes the width of the div always 100% of the actual browser width.

to center something you must make the
margin: 0 auto 0 auto; (or replace whatever px you want for top and bottom)

and either delete the width to let whatever is within it define that width, or make it manageable at like 500px.

And for good measure to make tables center in IE put
body {
text-align: center;
}

This means you will have to text-align everything elses text you don't want center, but hey... that's IE for ya.

Oh no... an absolutely positioned top menu too.

Geez... i'm gonna have to break out the cutting torch on this baby.

Please do. I would really like this page to work well.

Go to the webpage if you would be so kind. I implemented the auto like you sugested, however, it is still doing the whole gap thing.

Take a look here --> sweetastic.com/ozone/stony.html

I converted it to the best (and fastest) way to make it work with all of IE & Moz quirks.

It works more the way you want it right now with IE but you need to address quirks with Moz.

Nice one genis, that looks great....

Thanks Phil!

Yeah it took me forever to figure out how to do that kind of layout when I was just starting out with table-less CSS2.

I'm glad I could lay it out for WarMage in about an hour.

Yep, nice work genis.

good to see quality CSS work =)

Where's my props from WarMage?

Look how sad I am without getting props from whom I did it for -->

you get mad props. I implemented your ideas. They worked well. There is a lot there I don't understand the reasoning behind, such as using 0 0 0 0; instead of 0px; or even 0px 0px 0px 0px; there were a couple of errors, however the code is much more usable and compact now. Thanks a lot.

Sorry I didn't get back to you sooner, you should have seen work yesterday it was hell. I didn't get onto the asylum. You would think that being signed on as a webmaster didn't involve jobs such as moving boxes and other supplies...

I only get to check the web from work no a days seeing as my campus living situation doesn't provide an internet connection that doesn't cut out for days on end. You would think that with 2 T3 lines they would be able to have a good amount of uptime, but the residencial networks just don't want to stay up.

From that description I'd think you lived in College Station at my old apartment complex.

Anywho,
0 0 0 0; is used because 0 is the lowest for anything 0px and 0pt or 0em, all show the same thing.
no need for the extras.

Do you have Topstyle?
Topstyle is awesome for the CSS and XHTML in the new version 3.
It's all i use these days for design work. You should check it out.

Thanks for the props and <Nick Burns>You're Welcome!</Nick Burns>

Yep, college station it is. At Stony Brook I am one of three webmasters over 12 website sections (1 site per area of student affairs). The number of sites keeps growing as each department becomes more aware of us and the capabilities of the web. So we run some 300 to 400 pages right now between 3 of us, using just HTML and a little HTML which we hacked into the server via the .htaccess.

We just got our own server around 2 weeks ago, however, it is remote and the admin is lax on setting anything up on it, i.e. FTP. That is where I am right now with college station.

As for topsite, I don't think that I hace ever tried it. I have windows at work and I tend to use editplus there, as well as xemacs on my FreeBSD at home. I think I will take you reccomendation and download TopSite and see what happens, its prolly a wins program, maybe tomorrow at work.