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

    Join Date
    Aug 2003
    Posts
    13
    Rep Power
    0

    Unhappy urgent CSS problem


    Hi all,

    I have a basic CSS layout here -

    www.plastikwrap.co.uk/education/css

    Problem no.1 - I cannot work out why the area to the right of the body of text does not contain a background image as defined in the style sheet. As you can see, there should be a vertical blue line to join up with the line at the bottom of the text but there is not.

    Porblem no.2 - I can't get the body of text to dynamically resize to a certain percentage. I need it to fill the screen reasonably so the page looks good and fills the screen on any resolution. As you can see in the stylesheet i've used percentages, but they don't seem to do much.

    -----------

    I previously started this design using sliced images in tables, but moved over to CSS because I thought it would be easier to do and more reliable to view and manage content in.

    This is a very urgent assignment that I need to complete by Thursday, so any help would be hugely appreciated.

    Please feel free to dissect and alter the code in any way to demonstrate to me what I'm doing wrong.

    I'm grateful for any input; i'm at my wits end with this damn thing

    Thanks in advance

    melatonin
  2. #2
  3. Thanks Johnny Hart (BC) R.I.P.

    Join Date
    May 2003
    Location
    Dallas
    Posts
    5,268
    Rep Power
    1955
    Actually, all your widths are fixed values. I played some with % values, using 100% for #subMaster, 75% for #content, and 75% for #contentText.

    I messed up your border image alignment with these values, but I leave the fixing thereoof as an exercize for the class. You will be questioned at your next recitation

    I did not see any use of .contentRight.

    I found this at the bottom--don't know what it is
    Code:
    </body>
    </html>
    	width: 323px;
    	float: left;
    	background: black;
    	overflow: hidden;
    You'll have to play with this, but I think this should provide a modicum of clue.

    It's a pretty page.

    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.
  4. #3
  5. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2003
    Posts
    13
    Rep Power
    0
    Thanks for your reply.

    There is an instance of .contentRight in the HTML just below the body of text. It doesn't seem to display, at least its background doesn't. I'm pretty sure the background attribute syntax is correct, so I don't know why the background isn't displaying.

    The DIV must be displaying becayse when I insert the background as an image instead of as a background, it displays. So for whatever reason, the background is not showing up.

    I tried inputting your values, and they are better as they do fill the screen, but they don't resize for me (ie when the browser window is resized, they don't move to the appropriate % dimensions.)

    I'm interested in why you said my values are relative (all the widths are absolute, but the height for the #content DIV and any DIVs contained in it should be relative as they need to stretch downwards as needed)

    I think the problem is with the relationship between the DIVs in the #content DIV and the dimensions of the page; they are being assigned their height from the height of the container DIVs, #subMaster and #master, instead of directly from the height of the page. I don't know how to make this happen however.

    Help much appreciated.
  6. #4
  7. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2003
    Posts
    13
    Rep Power
    0
    PS the snippet at the bottom was just me swapping out part of the stylesheet while experimenting.
  8. #5
  9. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2003
    Posts
    13
    Rep Power
    0
    i managed to get the background to work - it seems an assigned height value made it appear.

    I'll reupload what i've got now -

    http://www.plastikwrap.co.uk/education/css
  10. #6
  11. Thanks Johnny Hart (BC) R.I.P.

    Join Date
    May 2003
    Location
    Dallas
    Posts
    5,268
    Rep Power
    1955
    Melatonin said
    I'm interested in why you said my values are relative (all the widths are absolute, but the height for the #content DIV and any DIVs contained in it should be relative as they need to stretch downwards as needed)
    Actually, I said
    Actually, all your widths are fixed values. I played some with % values, using 100% for #subMaster, 75% for #content, and 75% for #contentText.
    I note that you still have fixed widths. There is no way for the site the expand horizontally.

    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.
  12. #7
  13. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2003
    Posts
    13
    Rep Power
    0
    Sorry, I misunderstood.

    It's not horizontally that i need it to stretch; only vertically.
  14. #8
  15. Thanks Johnny Hart (BC) R.I.P.

    Join Date
    May 2003
    Location
    Dallas
    Posts
    5,268
    Rep Power
    1955
    Originally posted by melatonin
    Sorry, I misunderstood.

    <snip>
    Ah. So did I.

    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.

IMN logo majestic logo threadwatch logo seochat tools logo