Jump to content

Off topic Design question


piper338

Recommended Posts

Hey guys, I'm new to most of this stuff I am really starting to enjoy website creation. I've been learning CSS and the use of Divs. to me I love the designing without tables.

I drew a website up tonight the background is a slight gradient and I'm trying to have a transparent content box.  My problem is the gradient It cant Repeat-Y because the backgrounds wont match.  And I tried making a .Gif but it didn't work, and I hear some browsers do not support .png's right now.

Here is the start of my design, what is the best way to make content boxes like I am attempting to do? I've seen it don't with 5 Divs, top, bottom, left, right and center. Mine only had 3 top center and bottom, then I used padding to align the text.

Here is the beginning of what I am working on.

http://i34.tinypic.com/2l9lcw0.jpg

Thanks,

Chad C.

Link to comment
Share on other sites

Looks good!

For the background, I always use a png with transparency horizontally repeated, and a block colour background underneath for the rest of the page - e.g. In your case, a darker blue gradient to transparent, and then a lighter blue block colour background underneath. This should give the desired effect (Im not aware of browsers not supporting png's - if they don't they're far behind).

The best way to make content boxes with div's is pretty much however you want it to look; one, two, three+ columns... it's possible.

Good luck :)

Link to comment
Share on other sites

  • Administrators

You don't need to use PNGs for a different background color, you can just set the "box" div to a different background color.

Then to round corners, I use:

http://www.malsup.com/jquery/corner/

There's CSS also to round corners, but I don't think it works on IE (not sure about IE8).

Gradients, I always go to white, since it's in the background. Like:

http://dev.vacentral.net/

Which I'll be changing a bit soon

Link to comment
Share on other sites

Thanks guys I continue to learn.

New problem haha..

I am making a new design, it's a bit sloppy cause I really don't know what I am doing.

Here it is http://flyvva.org/

The problem is I need the height to be at least 900px for the Background to show up correctly, however if I set the height to a fixed width Content that extends greater than 900px is not displayed correct.

So the question is. Is there a way to have the <DIV> Height be at least 900px the expand if it fills up? Or some kind of work around for this.

I drew my design up and it has been a nightmare for a beginner to code, lol.

Thanks,

Chad C.

Link to comment
Share on other sites

  • 2 weeks later...

Hey guys I need some more help,  I have a drop down menu it's pure css cause I sure don't know much about Jquery stuff... but I want the left border of the drop down to align with its relative on top...

http://flyvva.org

Any ideas?

Oh, and sorry for the sloppy css, I gotta go back and group things a bit better..

Thanks,

Chad C.

Link to comment
Share on other sites

Hum, I'll give that a try the div layouts are still kinda confusing to me even haha cause I've never made a site with that much background so to get it to look right I have to make a bunch of wraps I'm sure there was a better way of doing it, but I'm just a furloughed pilot, and a newbie to this stuff. haha

BTW Tom,  While i was in IE I looked at your site, and the nav isn't there in IE just FYI.

Chad C.

Link to comment
Share on other sites

  • 2 weeks later...

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...