|
|
 |
|
|
Thread Tools | Display Modes |
|
|
Oct 29th, 2006, 4:42 PM
|
#1 |
|
Newbie
Join Date: Oct 2006
Posts: 4
Rep Power: 0
 |
CSS help
Im pretty inexperienced at CSS, and right now I am trying to get a sidebar up beside a set of divs...anyways some wierd stuff is happening: (screenshot) http://www.ncrusaders.com/random/error.jpg
here is the css that defines it: #sidebarbg{
width: 131px;
float: right;
clear: left;
background: url(images/sidebarbg.jpg);
}
#sidebartop{
width: 131px;
float: right;
clear: left;
height: 20px;
background: url(images/sidebartop.jpg);
}
#sidebarbottom{
width: 131px;
float: right;
clear: left;
height: 20px;
background: url(images/sidebarbottom.jpg);
}<div id="sidebartop"> </div> <div id="sidebarbg"> test </div> <div id="sidebarbottom"> </div> Help would be greatly apreciated. I posted this on another forum like 5 hours ago and still havnt gotten a response  |
|
|
|
Oct 29th, 2006, 5:10 PM
|
#2 |
|
Programming Guru
 
Join Date: Aug 2005
Location: England
Posts: 1,499
Rep Power: 5
|
A whole 5 hours, eh? :p
Anyway, just wrap all your divs up inside another div, like so: <div id="sidebar">
<div class="top"></div>
<div class="body">
test
</div>
<div class="bottom"></div>
</div>#sidebar {
width: 131px;
float: right;
}
#sidebar .top {
height: 20px;
background: url(images/sidebartop.jpg);
}
#sidebar .body {
background: url(images/sidebarbg.jpg);
}
#sidebar .bottom {
height: 20px;
background: url(images/sidebarbottom.jpg);
} |
|
|
|
|
Oct 29th, 2006, 5:23 PM
|
#3 |
|
Resident Grouch
Join Date: Jun 2005
Posts: 6,453
Rep Power: 10
|
I'd put them in an enclosing div, like this:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style>
#enclose{
width: 132px;
float: right;
clear: left;
height: 100%;
}
#sidebarbg{
width: 130px;
clear: left;
background: url(images/sidebarbg.jpg);
}
#sidebartop{
width: 130px;
clear: left;
height: 20px;
background: url(images/sidebartop.jpg);
}
#sidebarbottom{
width: 130px;
clear: left;
height: 20px;
background: url(images/sidebarbottom.jpg);
}
</style>
<title>Untitled Document</title>
</head>
<body>
<div id="enclose" style="border: 2px solid #00ff00;">
<div id="sidebartop" style="border: 2px solid #ff0000;">Top
</div>
<div id="sidebarbg" style="border: 2px solid #ffff00;">
Center
</div>
<div id="sidebarbottom" style="border: 2px solid #0000ff;">Bottom
</div>
</div>
</body>
</html> And if those sorry volunteer suckers didn't respond within 5 hours on a Sunday, I'd demand my money back!!!
__________________
Abstraction doesn't make it impossible to write bad code; it makes it possible to write superior code. Contributor's Corner: Grumpy on C++ Exceptions DaWei on Pointers |
|
|
|
|
Oct 29th, 2006, 5:33 PM
|
#4 |
|
Programming Guru
Join Date: Aug 2005
Location: England
Posts: 1,499
Rep Power: 5
|
Snap
 |
|
|
|
|
Oct 29th, 2006, 5:49 PM
|
#5 |
|
Resident Grouch
Join Date: Jun 2005
Posts: 6,453
Rep Power: 10
|
LOL! Your post wasn't there when I went off to test it, and I didn't refresh the page!
__________________
Abstraction doesn't make it impossible to write bad code; it makes it possible to write superior code. Contributor's Corner: Grumpy on C++ Exceptions DaWei on Pointers |
|
|
|
|
| Bookmarks |
| Currently Active Users Viewing This Thread: 1 (0 members and 1 guests) | |
| Thread Tools | |
| Display Modes | |
|
|
Hybrid Mode
