+ Reply to Thread
Page 1 of 2 12 LastLast
Results 1 to 10 of 13

Thread: Help with CSS+Div's

  1. 12-01-2007 10:10 AM #1
    shanes's Avatar
    shanes
    shanes is offline     x10Hosting Member shanes is an unknown quantity at this point
    Join Date
    Oct 2007
    Posts
    35

    Help with CSS+Div's

    Well i'm coding a layout for someone and I've encounterd a little problem...
    http://shanes.pcriot.com/swinkid/index.html is the url

    I wanted to centre the layout without using tables so I made a container div , the problem with this is for some reason the contain div closes off without me wanting it to .
    Here's the soruce:
    HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>--ss--</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="Keywords" content="Habbo,Layout" />
<meta name="Description" content="This layout is coded by --ss-- off Habboxforum.com for Swinkid." />
<style type="text/css">
<!--
body {
  padding: 0px;
  background-image: url(images/bg1.gif);
}
#container {
  width: 798px;
  background-color: #4B6D78;
  border-style: solid;
  border-color: #000000;
  border-width: 1px;
  font-family: verdana;
  font-size: 12px;
}
#banner {
  width: 798px;
  height: 118px;
  background-image: url(images/banner.PNG);
}
#top {
  width: 798px;
  height: 20px;
  background-image: url(images/m_bg.PNG);
  padding-top: 4px;
}
#box {
  width: 169px;
  background-image: url(images/box_bg.PNG);
  background-color: #4B6D78;
  float: left;
  margin-left: 4px;
  margin-top: 14px;
  text-align: left;
}
-->
</style>
</head>
<body>
<center>
<div id="container">
  <div id="banner"> </div
   <div id="top">123</div>
    <div id="box"><img src="images/box_top.PNG" /> &#187;Test<br /> &#187;Test<br /><img src="images/box_bot.PNG" /> </div>
</div>
</center>
</body>
</html>
    I want the background colour I have for my container to go behind the 'box' div

    Reply With Quote Reply With Quote
  2. 12-01-2007 11:06 AM #2
    iamcrux
    iamcrux is offline     x10Hosting Member iamcrux is an unknown quantity at this point
    Join Date
    Nov 2007
    Posts
    25

    Re: Help with CSS+Div's

    try this one:
    #container #banner {
    width: 798px;
    height: 118px;
    background-image: url(images/banner.PNG);
    }
    and so on

    banner is child of container... so is top and box. Hope u got it...
    Last edited by iamcrux; 12-01-2007 at 11:17 AM.
    Reply With Quote Reply With Quote
  3. 12-01-2007 02:10 PM #3
    shanes's Avatar
    shanes
    shanes is offline     x10Hosting Member shanes is an unknown quantity at this point
    Join Date
    Oct 2007
    Posts
    35

    Re: Help with CSS+Div's

    Quote Originally Posted by iamcrux View Post
    try this one:

    and so on

    banner is child of container... so is top and box. Hope u got it...
    Tried putting '#container' infront of the others but ti still doesn't work.
    I think i'm not explaining it well enough , my 'container' div seems to end after the '#top' div , I want my 'box' to be inside itso the background around the box is the blue colour not the background i've put in for the body

    Reply With Quote Reply With Quote
  4. 12-01-2007 03:08 PM #4
    sourfacedcyclop's Avatar
    sourfacedcyclop
    sourfacedcyclop is offline     x10 Sophmore sourfacedcyclop is an unknown quantity at this point
    Join Date
    Sep 2007
    Posts
    221

    Re: Help with CSS+Div's

    It might be because you didnt close you banner div...
    Last edited by sourfacedcyclop; 12-01-2007 at 03:10 PM.
    Reply With Quote Reply With Quote
  5. 12-01-2007 04:27 PM #5
    shanes's Avatar
    shanes
    shanes is offline     x10Hosting Member shanes is an unknown quantity at this point
    Join Date
    Oct 2007
    Posts
    35

    Re: Help with CSS+Div's

    Quote Originally Posted by sourfacedcyclop View Post
    It might be because you didnt close you banner div...
    Lol just noticed that , +rep for pointing that out , I've closed the div yet it's still the same :s
    If I do <br />'s the blue background show's underneath the 'top' div so i'm guessing for some weird reason the 'Box' isn't placed inside the container div :dunno:

    Reply With Quote Reply With Quote
  6. 12-01-2007 05:07 PM #6
    sourfacedcyclop's Avatar
    sourfacedcyclop
    sourfacedcyclop is offline     x10 Sophmore sourfacedcyclop is an unknown quantity at this point
    Join Date
    Sep 2007
    Posts
    221

    Re: Help with CSS+Div's

    Not sure if this would work but you could try to give your container a height value.
    Reply With Quote Reply With Quote
  7. 12-01-2007 06:38 PM #7
    iamcrux
    iamcrux is offline     x10Hosting Member iamcrux is an unknown quantity at this point
    Join Date
    Nov 2007
    Posts
    25

    Re: Help with CSS+Div's

    Quote Originally Posted by shanes View Post
    Lol just noticed that , +rep for pointing that out , I've closed the div yet it's still the same :s
    If I do <br />'s the blue background show's underneath the 'top' div so i'm guessing for some weird reason the 'Box' isn't placed inside the container div :dunno:

    wel then...
    try to replace
    float: left;
    property with
    float: none;
    this will make #box to go inside #container... try that
    Last edited by iamcrux; 12-01-2007 at 06:47 PM.
    Found this useful???

    click to thank me...

    Thank You
    Reply With Quote Reply With Quote
  8. 12-03-2007 10:04 AM #8
    shanes's Avatar
    shanes
    shanes is offline     x10Hosting Member shanes is an unknown quantity at this point
    Join Date
    Oct 2007
    Posts
    35

    Re: Help with CSS+Div's

    Quote Originally Posted by iamcrux View Post
    wel then...
    try to replace


    property with

    this will make #box to go inside #container... try that
    Thank's that worked but how do I know poisition the boxes to the left of the container without using the float tags :S

    Reply With Quote Reply With Quote
  9. 12-03-2007 09:47 PM #9
    Jober68
    Jober68 is offline     x10Hosting Member Jober68 is an unknown quantity at this point
    Join Date
    Dec 2007
    Posts
    62

    Re: Help with CSS+Div's

    maybe use a div.class instead of an id? I'm not really sure what difference it makes but it's worth a shot.
    Reply With Quote Reply With Quote
  10. 12-04-2007 02:47 AM #10
    jensen's Avatar
    jensen
    jensen is offline     x10 Lieutenant jensen is an unknown quantity at this point
    Join Date
    Nov 2005
    Location
    At my desk
    Posts
    438

    Re: Help with CSS+Div's

    Maybe you can use paint to sketch what you would like the page to look like so that we can give some suggestions as to what to plan to achieve. Thanks. You could also use the firebug extension on Firefox2 or the webdev tool bar in IE6 to find out what's happening on your page.
    "For I am not ashamed of the gospel of Christ: for it is the power of God unto salvation to every one that believeth" Romans 1:16
    Reply With Quote Reply With Quote
+ Reply to Thread
Page 1 of 2 12 LastLast
« Previous Thread | Next Thread »

Similar Threads

  1. A HTML + CSS Basic Tutorial
    By Zenax in forum Tutorials
    Replies: 14
    Last Post: 09-02-2011, 01:42 PM
  2. Stacking Divs
    By Zenax in forum Scripts & 3rd Party Apps
    Replies: 0
    Last Post: 02-16-2007, 07:00 AM
  3. Make two DIVS in one row?
    By amrclutch1 in forum Scripts & 3rd Party Apps
    Replies: 3
    Last Post: 12-04-2006, 05:01 PM
  4. I require your help with divs!
    By randomize in forum Scripts & 3rd Party Apps
    Replies: 6
    Last Post: 07-05-2006, 03:19 PM
  5. Yay! DIVS! :D
    By Conor in forum Graphics & Webdesign
    Replies: 10
    Last Post: 09-24-2005, 07:54 AM

Posting Permissions

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

Forum Rules

x10hosting free hosting for the masses
dedicated servers