#1
  1. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2003
    Posts
    4
    Rep Power
    0

    Question CSS: making a box fit entire page


    I have tried getting my pages to load to 100% of the size needed in the page, but the problem is that they never do, so I have to specify a specific height in my stylesheet. However this causees a really long blank space at the bottom for most of the other pages in the site. The code for my stylesheet is at
    http://faculty.eng.fiu.edu/~jdela06/...rep/layout.css

    and one of the pages is
    http://faculty.eng.fiu.edu/~jdela06/...pplication.htm

    i appreciate any help
  2. #2
  3. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2003
    Location
    Orange County, CA
    Posts
    101
    Rep Power
    12
    you've got to think about simplifying your style sheets.. why do you need two, AND additional styles on the page? I'd love to see that, it might make what your doing a bit more clear, so i can help you out
    also, i don't know why you chose javascript to do the work css can do for your menu. here's an example for the menu:

    (this would go into a stylesheet.)
    Code:
    a { width:100%;height:100%;background:#0000FF;text-decoration:none; }
    a:hover { background:#FF0000; }
    .. it's that simple.. no need for classes, or onMouse events. Just an idea.
  4. #3
  5. Thanks Johnny Hart (BC) R.I.P.

    Join Date
    May 2003
    Location
    Dallas
    Posts
    5,268
    Rep Power
    1956
    Hi,

    As the guy with the sophomoric monicker said, you've got some unneeded CSS complexity. You have some serious problems with functionality that should be met before worrying about the layout.

    Your nav links aren't links. You depend on a javascript onclick event which fails if your viewer can't or won't use js. Your "links" are dead.

    Your form is poorly formed (pun not intended). The submit button does not submit the data to the server. It opens the user's mail client with a MAILTO: tag. No data is submitted.

    I suggest you backtrack to step 1 by refactoring your page in proper html. Follow that by creating a style sheet to handle layout. Finally, use javascript to embellish the feel.

    On a separate level, you will need to write the backend (server-side) script(s) to handle the data from the form.

    For some hints, you may be interested in these snippets. One illustrates a hybrid method of vertically centering your page. This might be an alternative to extending the vertical. Another is a vertical navbar much like yours. It is fully functional html with CSS to embellish the look and allow for further layout control. There is no js.

    To recap:

    1. make it functional html
    1a. write the backend scripts
    2. lay it out with stylesheets
    3. embellish with js

    cheers,

    gary
    There are those who manage to build a web site without knowing what they're doing; thereby proving to themselves they do, indeed, know what they're doing.

    My html and css workshop, demos and tutorials.
    Ask a better question, get a better answer.
  6. #4
  7. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2003
    Posts
    4
    Rep Power
    0
    Sorry for the messiness, i used the javascript because I had learned that new technique and wanted to try applying it, but I did change it.

    I'm using seperatre css for layout and for style, and I have page-specific css in some pages so as not to make all the files so big (for ease of reading).

    I'll also be changing the forms, its using a frontpage form submission thing which works sometimes but usually doesn't . The thing is the server its loaded on does not allow any dynamic scripting, so I've been thinking of writing the back-end code on another (remote) server and hopefully that should work.

    I liked the idea of using a UL for the navbar so thats what I did to eliminate the table. Right not I'm having problems with IE and Opera, for some reason they add spaces between the elements.
    I also have to keep trying to get the size thing to work right. I didn't want to use the verticle centering thing, since most of the pages are different sizes and i think that would make it feel awkward when changing pages.

IMN logo majestic logo threadwatch logo seochat tools logo