Results 1 to 9 of 9
  1. #1
    Join Date
    Apr 2004
    Posts
    360

    Need help with a pure div design

    Example of design: http://www.eyesoute.com/new/
    New div version: http://www.eyesoute.com/new/index2.php


    I decided to move one of the sites I posted for review to an all div design to see how I like it, but I'm having some troubles.... I can't seem to get the entire design to stretch 100% width/height, and not have extra space at bottom from the divs stacking on each other.

    I would also like to know the best way to get a little watermark (Shown on both pages), to stay in that area, below the text but still in sight... I plan on having the div with content in it, have a background image, so that means I can't just put a background: bottom right, in the content div... Right? Or can divs have more then one background (That would be oh so nice)


    Note: You must view the second site in IE right now, for some reason it does not work outside of IE (Another problem I need help with )


    Thanks in advanced... I'm not really new to divs, but I am new to making pure div designs.

  2. #2
    Join Date
    Sep 2004
    Location
    Vancouver, BC Canada
    Posts
    122
    The second page doesnt load all the way. It just shows me the header image.

    I'm using Firefox.
    SharkBait
    Web Dev: php, MySQL, HTML, XHTML, JS, CSS
    www.DyanmicShark.com - Coming Soon!
    My Blog:www.tyleringram.com

  3. #3
    Join Date
    Apr 2004
    Posts
    360
    Quote Originally Posted by SharkBait
    The second page doesnt load all the way. It just shows me the header image.

    I'm using Firefox.
    I'm aware of that hince my "Note: You must view the second site in IE right now, for some reason it does not work outside of IE (Another problem I need help with )"

  4. #4
    Join Date
    Sep 2004
    Location
    Vancouver, BC Canada
    Posts
    122
    Oops I missed that line some how sorry
    SharkBait
    Web Dev: php, MySQL, HTML, XHTML, JS, CSS
    www.DyanmicShark.com - Coming Soon!
    My Blog:www.tyleringram.com

  5. #5
    Join Date
    Apr 2004
    Posts
    360
    Err... Well do you have any advice?

  6. #6
    Join Date
    Apr 2005
    Posts
    503
    First, if you must use Xhtml, you have to end the <link> tag with a proper closing />. This is also true of the img tag.

    Second, you shouldn't be previewing in IE. IE is old, buggy and non-standard. Do your initial tests in Firefox. Then adjust for IEs quirks and bugs.

    Validate your html and css early and often and you would have caught the two errors mentioned above.

    No, you cannot have more than one background image.

    Without any content, the divs will not expand just because you add 100% to the height or width. In addition, you have to think "100% of what?". Each parent needs a spec to relate to.
    IE7 is nine years behind the standards or wrong.
    But it works in IE!
    "IE is a cancer on the web" -- Paul Thurott
    "Avoid hacker-bait apps like Internet Explorer" -- Kevin Mitnick

  7. #7
    Join Date
    Apr 2004
    Posts
    360
    Well after about an hour and a half of working with a friend of mine, I got it to work... In a way
    www.eyesoute.com/new/index2.php

    As you can see, a new problem has arisen... When content goes over the 100% mark, the divs don't stretch with it. Now this is obviously because I'm using position absolute on the content... However, it is the ONLY thing that has worked for me....


    Any suggestions?

  8. #8
    Join Date
    May 2006
    Location
    Teh Interweb
    Posts
    314
    You would be WAY better off to put all your styling in your css file instead of inline and external. This would make it amazingly easier to troubleshoot. Also, tags like <font> and <b> should be in your css file as well. I like the idea that you are going on and the color scheme looks nice but the code is almost impossible to follow. Try to seperate your element styling and your xhtml and then let us take another look.

    [theBleeber@wht01] ~ $ cat .signature
    cat: .signature: No such file or directory

  9. #9
    Join Date
    Sep 2004
    Location
    singapore
    Posts
    126
    Follow this format

    <div id="LogoBackground"><img src="logo" /></div>
    <div id="leftsidebar" style:float:left;>content</div>
    <div id="rightsidebar style="float:right; background image bottom right">content</div>
    <div id="footer" style="clear:both;"> </div>

    Your divisions are closed at wrong sections. Google more on two column layouts

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •