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.
Page 1 of 3 123 LastLast
Results 1 to 15 of 33
  1. #1
    New Coder
    Join Date
    Sep 2002
    Location
    Brooklyn, NYC
    Posts
    79
    Thanks
    0
    Thanked 0 Times in 0 Posts

    I cannot get this layout to work!!

    Hello all.
    I'm really having a hard time with this webdesign stuff... I'm not a designer by any means... I'm just trying to get this layout to work. I haven't finished the nav or links, color scheme, header, or anything yet.

    Could someone look at my code? I can't seem to get this layout to work in 800x600 without a space on the right side... Also, somehow in dreamweaver, I got those spacer.gif's on there and am not sure what they do.

    here's the site...

    messed up layout

    By the way... I know that I'll get slammed for not using CSS (which I don't know) and that the code is outdated, but I just need to get this up for now.

    Thanks for any insight or suggestions!
    jay

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Location
    ColoRockyz
    Posts
    1,649
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Can't really tell with all those crazy images spacers, tables and stuff...but offhand, looks like your col spans are goofed...
    You could do that with a fraction of coding btw...just ask
    Zoobie or not Zoobie...That is the problem.
    <body onUnload="flush( ! )">

  • #3
    New Coder
    Join Date
    Sep 2002
    Location
    Brooklyn, NYC
    Posts
    79
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'm asking...

    How would I do that with the fraction of the code? or perhaps some suggestions on how I fix what I currently got going on?

    Thanks again
    jay

  • #4
    Senior Coder
    Join Date
    Jun 2002
    Location
    ColoRockyz
    Posts
    1,649
    Thanks
    1
    Thanked 0 Times in 0 Posts
    >>without a space on the right side
    Ok...First off, what space? At the top-right of the page? You're looking for a basic 3 column layout with a center main and 2 nav bars on both sides?
    Zoobie or not Zoobie...That is the problem.
    <body onUnload="flush( ! )">

  • #5
    New Coder
    Join Date
    Sep 2002
    Location
    Brooklyn, NYC
    Posts
    79
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Originally posted by zoobie
    >>without a space on the right side
    Ok...First off, what space? At the top-right of the page? You're looking for a basic 3 column layout with a center main and 2 nav bars on both sides?
    Thanks for replying again... Yeah.. In 800x600, I'm getting a horizontal scrollbar and have a small space of white on the right of the site.

    Secondly... yes, I'm looking for a basic 3 column site... an image header, nav bars on both sides, and the main center area. Right now I'm using background images for each column and the header as well as 2 vertical 9 pixel lines between the left column and center... and between the right column and center.

    Any ideas?

    thanks a bunch.
    I really appreciate it.
    jay

  • #6
    Senior Coder
    Join Date
    Jun 2002
    Location
    ColoRockyz
    Posts
    1,649
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Alright...Give me a few and check back in an hour or so...
    Zoobie or not Zoobie...That is the problem.
    <body onUnload="flush( ! )">

  • #7
    Senior Coder
    Join Date
    Jun 2002
    Location
    ColoRockyz
    Posts
    1,649
    Thanks
    1
    Thanked 0 Times in 0 Posts
    See if this works for you...kinda a corporate look. You can change the font size of the links in the head.

    <HTML>
    <HEAD>
    <TITLE>lost studios</TITLE>
    <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
    <style>
    a {font:normal 15px arial; color:white;display:block}
    </style>
    </HEAD>
    <BODY BGCOLOR=#FFFFFF text="#FFFFFF" link="#FFFFFF" vlink="#FFFFFF" alink="#FFFFFF" leftMargin=0 topMargin=0 >
    <div style="width=100%; height:80px /*take height:80px out when you use your header image*/">
    <img src="" width="" height="" border="0">
    </div>

    <div style="float:left; background-color:brown;width:20%;padding-bottom:30px;text-align:center;">
    <b>Main Navigation</b><br>
    <a href="index.html">home page</a>
    <a href="services.htm">services offered</a>
    <a href="images.htm">studio images</a>
    <a href="staff.htm">staff</a>
    <a href="portfolio.htm">portfolio</a>
    <a href="rates.htm">studio rates</a>
    <a href="policies.htm">studio policies</a>
    <a href="policies.htm">studio policies</a>
    <a href="contact.htm">contact & booking</a>
    <br>
    <b>Resources</b><br>
    <a target=new href="http://www.rlabels.com">record labels</a>
    <a target=new href="http://www.getsigned.com">get signed</a>
    <a target=new href="http://www.starpolish.com">star polish</a>
    <a target=new href="http://www.discmakers.com">disc makers</a>
    <a target=new href="http://www.newmetal.com">new metal</a>
    <a target=new href="http://www.taxi.com">taxi</a>
    <br>
    <b>Friends</b><br>
    <a target=new href="http://www.artistcollaboration.com/~jay">LSDesigns</a>
    <a target=new href="http://www.sonicvalley.com">sonic valley</a>
    <a target=new href="http://www.artistcollaboration.com">artist collaboration</a>
    </div>

    <div style="text-align:left;float:left;width:58%;margin-left:10px;font:normal 14px verdana;color:black">
    <span style="font:bold 18px verdana;color:black">Welcome
    to lost studios...</span><br><br>
    lost studios is a digital harddisk recording &amp; production studio as well
    as a multimedia &amp; design facility. &nbsp;We primarily work with
    local New York City area artists, labels, and businesses for songwriter
    &amp; band releases, band demos &amp; project CD's, music arrangement
    &amp; production, radio &amp; commercial spots, and sound for picture.<br><br>From a simple vocal demo to a full-length, fullblown production, lost studios can accomodate virtually all your recording and multimedia needs.
    </div>

    <div style="float:right; background-color:brown;width:20%;padding-bottom:30px;text-align:center;color:white;">
    <b>Main Navigation</b><br>
    <a href="index.html">home page</a>
    <a href="services.htm">services offered</a>
    <a href="images.htm">studio images</a>
    <a href="staff.htm">staff</a>
    <a href="portfolio.htm">portfolio</a>
    <a href="rates.htm">studio rates</a>
    <a href="policies.htm">studio policies</a>
    <a href="policies.htm">studio policies</a>
    <a href="contact.htm">contact & booking</a><br>
    <b>Resources</b><br>
    <a target=new href="http://www.rlabels.com">record labels</a>
    <a href="portfolio.htm">portfolio</a>
    <a href="rates.htm">studio rates</a>
    <a href="policies.htm">studio policies</a>
    <a href="policies.htm">studio policies</a>
    <a href="contact.htm">contact & booking</a>
    <br>
    <b>Friends</b><br>
    <a target=new href="http://www.artistcollaboration.com/~jay">LSDesigns</a>
    <a target=new href="http://www.sonicvalley.com">sonic valley</a>
    <a target=new href="http://www.artistcollaboration.com">artist collaboration</a>
    </div>
    </BODY>
    </HTML>
    Zoobie or not Zoobie...That is the problem.
    <body onUnload="flush( ! )">

  • #8
    New Coder
    Join Date
    Sep 2002
    Location
    Brooklyn, NYC
    Posts
    79
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thank you so much!

    It looks great and is what I was looking for...

    I do have a question. Can I use a background images behind the navs and body section?

    Thanks again!
    Jay

  • #9
    Senior Coder
    Join Date
    Jun 2002
    Location
    ColoRockyz
    Posts
    1,649
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Sure...just insert this is the corresponding div's style:
    background-image: url(images/hat.jpg);
    and take out background-color:brown
    Best to read up on this here because there's many variations of background css...or post back with a link online so we can see.
    Last edited by zoobie; 01-24-2004 at 04:02 AM.
    Zoobie or not Zoobie...That is the problem.
    <body onUnload="flush( ! )">

  • #10
    New Coder
    Join Date
    Sep 2002
    Location
    Brooklyn, NYC
    Posts
    79
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Angry

    God!?! I'm getting so frustrated.

    Alright... I can't for the life of me get it the way I want. You definately got me in the right direction though!

    I want to make the background images for the header, nav's, and the center area a fixed size so it fits perfectly in 800x600. In any higher resolution it would remain the same size, but just center and have space on either side. The reason I want to make the background images for the navs and the center area is so I can make it more graphical and have color changes and some lines to break things up visually.

    I can't for the life of me get a image to sit within the div like you mentioned. The background image for each nav is 150x450...It doesn't seem to work when I try it...

    <div style="background-image:images/leftnavbackground.gif;text-align:center;">

    One more thing... is 770px as big horizontally as you can go before you get scroll bars @ 800x600? My header is 770 by 75 and this is how I inserted it...

    <div style="width=100%" align="center"> <img src="images/header.gif" width="770" height="75" border="0">

    Sorry I'm such a newb... and thanks for the patience and help.


    Any insight?
    jay
    Last edited by lost; 01-24-2004 at 05:16 AM.

  • #11
    Senior Coder
    Join Date
    Jun 2002
    Location
    ColoRockyz
    Posts
    1,649
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Your header should be ok...
    For the left nav bar, try:
    <div style="float:left; background-image: url(images/leftnavbackground.gif);width:20%;padding-bottom:30px;text-align:center;">
    Zoobie or not Zoobie...That is the problem.
    <body onUnload="flush( ! )">

  • #12
    New Coder
    Join Date
    Sep 2002
    Location
    Brooklyn, NYC
    Posts
    79
    Thanks
    0
    Thanked 0 Times in 0 Posts
    hmm... it's not working for me.

    I uploaded that left nav bar with my original code, but with the background image in it so you can see what I'm trying to do...

    take a look at the left nav bar... I want to do things like this with the other nav bar and the center box as well.

    http://www.artistcollaboration.com/~loststudios

  • #13
    Senior Coder
    Join Date
    Jun 2002
    Location
    ColoRockyz
    Posts
    1,649
    Thanks
    1
    Thanked 0 Times in 0 Posts
    That's the old page...Put your new page on so I can see it
    Zoobie or not Zoobie...That is the problem.
    <body onUnload="flush( ! )">

  • #14
    Senior Coder
    Join Date
    Nov 2003
    Location
    Minneapolis, MN
    Posts
    2,879
    Thanks
    2
    Thanked 65 Times in 56 Posts
    Hi lost,

    Try www.w3schools.com . It's a good place to get some background on coding before you take on the task of building a page without an editor.

    Hope this helps,

    Rich

  • #15
    New Coder
    Join Date
    Sep 2002
    Location
    Brooklyn, NYC
    Posts
    79
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Unhappy

    Ok... zoobie.

    I've re-put up the new version...This is the code that you gave me with background images that I've put in the divs... I still can't for the life of me get the thing layed out the way I want! The right nav bar is below everything else and I can't get the entire site to center at higher resolutions. I'm not sure about that float: tag...

    What I want is it to fit perfectly in 800x600, and then in higher resolutions, I want the site not to stretch but to remain the same size and just center...

    Could you please take another gander at my code and tell me whats the deal?

    thanks a million!
    Jay

    http://www.artistcollaboration.com/~loststudios
    Last edited by lost; 01-24-2004 at 10:09 PM.


  •  
    Page 1 of 3 123 LastLast

    Posting Permissions

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