Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Nov 2006
    Posts
    33
    Thanks
    0
    Thanked 0 Times in 0 Posts

    div layout HELP!!!

    ok, im trying to make a layout purely out of divs since i heard that layouts with tables are bad for some reason.

    ive never really used divs EVER, so im trying. below is the code... im using just to get a hang of it.
    im trying to get all the blocks to fall under the blue box and to get rid of the gap between the red and gray box(es)
    Code:
    <div width="738" align="center" style="background-color: #FFFFFF; text-align:center">
    
    	<div width="728">
    		<img border="0" src="http://img299.imageshack.us/img299/8320/navbulletblueur0.gif" width="728" height="195">
    	</div>
    	
    	<div width="169" style="float: left">
    		<img border="0" src="http://img90.imageshack.us/img90/9233/navbulletredbr1.gif" width="164" height="887">
    	</div>
    	
    	<div width="564" style="float: right">
    		<img border="0" src="http://img90.imageshack.us/img90/3608/navbulletdgraygz1.gif" width="85" height="60">
    		<img border="0" src="http://img90.imageshack.us/img90/3608/navbulletdgraygz1.gif" width="468" height="60"><br>
    		<img border="0" src="http://img90.imageshack.us/img90/3608/navbulletdgraygz1.gif" width="557" height="78">
    	</div>
    	
    </div>
    and here is the preview http://www.freewebs.com/jl9148/test.htm

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Location
    The Netherlands, Baarn, Ut.
    Posts
    4,252
    Thanks
    0
    Thanked 0 Times in 0 Posts

    BonRouge

    Check out Bonrouge's CSS layouts; in your case, "2 columns fixed width" seems appropriate. The explanation shows how to structure the document and how to apply the CSS.
    Regards,
    Ronald.
    ronaldvanderwijden.com

  • #3
    Master Coder
    Join Date
    Jun 2003
    Location
    Cottage Grove, Minnesota
    Posts
    9,493
    Thanks
    8
    Thanked 1,089 Times in 1,080 Posts
    JL ...

    I'll give you an example to get you started. Notice when you view the
    HTML on the page (link below) ... the CSS is defined in the <head> section.
    You can also make a separate .css file for that, so all of your pages can use
    the same style sheet.

    You specified background images for those color sections ... they don't need
    to be images if it's just solid color (but I'm not sure of your intent, so I left
    them as background images).

    With my example that has a variety of thing you can play with, you should
    Google some CSS tutorials to help get you started.

    Here's the example page:

    http://www.catpin.com/jl.htm

    (view HTML source by clicking "View", "Source")

  • #4
    New Coder
    Join Date
    Nov 2006
    Posts
    33
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ^^ thanks, ive got the hang of it now.
    the solid blocks were just there to show an example of the content placed there.


  •  

    Posting Permissions

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