PDA

View Full Version : css layout questions

elpocho
02-22-2004, 10:38 PM
ok i have a few questions.

on a three column header layout how do i put a scrollbar on the center column?

on the same layout how do i change the color of the center column?

also how do i put borders into the layout?

thanks
MariGirl2003
02-22-2004, 10:56 PM
do u have a code.. u that i can work wit
elpocho
02-22-2004, 11:31 PM
here ignore whats in the right panel (its a calendar)
ummmmm i found the scrollbar so don't arry bout that
<style type="text/css">

body
{ margin-top: 0;
margin-bottom: 0;
margin-left: 0;
margin-right: 0;
padding-left: 0;
padding-right: 0;
bgcolor: #00ff00;
font-family: arial; size:"1";
link: #00ff00;
alink: #00ff00;
vlink: #00ff00;
border-color: #00ff00;
}

#header {
margin: 10px;
padding: 5px;
height: 80px;
bgcolor: #00ff00;
font-color: #000000;
border-color: #00ff00;
}
#leftPanel {
position: absolute;
left: 10px;
top: 100px;
width: 200px;
bgcolor: #00ff00;
font-color: #000000;
border-color: #00ff00;
}
#center {
top: 100px;
margin-left: 230px;
margin-right: 230px;
bgcolor: #000000;
border-color: #00ff00;
}
#rightPanel {
position: absolute;
right: 10px;
top: 100px;
width: 150px;
bgcolor: #00ff00;
font-color: #000000;
border-color: #00ff00;
}
</style>
</head>

<body>

<div id="header" style="background-color=#00ff00;>
<center><b>Rocky's World<b></center><br>
<a href="http://www.elmundoderocky.tk">espaņol</a>|<a href="">english</a>
</div>

<div id="leftPanel" style="background-color:#00ff00; text>
Links<p>
<a href="http://www.geocities.com/taylorsfiasco/home.html">Taylor's Fiasco</a>
<br>
<a href="http://www.javascript.internet.com">Javascript Scripts</a>
</div>


<div id="center" style="position:absolute; left:220px; top:110px; width:300px; height:300px; background-color:#000000; overflow:auto;"><font color="lime">

</font>
</div>

<div id="rightPanel" style="background-color:#00ff00;">
<div class="panelbackground">
<center>Calendar</center>
</div>
<div class="panelbackground">
<div class="panelComp">
<table cellpadding="2" cellspacing="1" border="0" class="calBorder" bgcolor="black" text="00ff00">
<tr>
<td></td>
<td class="calHeadHeavy" align="center" colspan="5">February</td>
</tr>

<tr class="calBorder">
<td class="calHeadHeavy" align="center">S</td>
<td class="calHeadHeavy" align="center">M</td>
<td class="calHeadHeavy" align="center">T</td>
<td class="calHeadHeavy" align="center">W</td>
<td class="calHeadHeavy" align="center">T</td>
<td class="calHeadHeavy" align="center">F</td>
<td class="calHeadHeavy" align="center">S</td>
</tr>

<tr>
<td class="calDay" align="center">1</td>
<td class="calDay" align="center">2</td>
<td class="calDay" align="center">3</td>
<td class="calDay" align="center">4</td>
<td class="calDay" align="center">5</td>
<td class="calDay" align="center">6</td>
<td class="calDay" align="center">7</td>
</tr>
<tr>
<td class="calDay" align="center">8</td>
<td class="calDay" align="center">9</td>
<td class="calDay" align="center">10</td>
<td class="calDay" align="center">11</td>
<td class="calDay" align="center">12</td>
<td class="calDay" align="center">13</td>
<td class="calDay" align="center">14</td>
</tr>
<tr>
<td class="calDay" align="center">15</td>
<td class="calDay" align="center">16</td>
<td class="calDay" align="center">17</td>
<td class="calDay" align="center">18</td>
<td class="calDay" align="center">19</td>
<td class="calDay" align="center">20</td>
<td class="calDay" align="center">21</td>
</tr>
<tr>
<td class="calDay" align="center"><a href="http://www.angelfire.com/falcon/meza/index/index.blog?from=20040222"><span class="calToday">22</span></a></td>
<td class="calDay" align="center"><span class="calFuture">23</span></td>
<td class="calDay" align="center"><span class="calFuture">24</span></td>
<td class="calDay" align="center"><span class="calFuture">25</span></td>
<td class="calDay" align="center"><span class="calFuture">26</span></td>
<td class="calDay" align="center"><span class="calFuture">27</span></td>
<td class="calDay" align="center"><span class="calFuture">28</span></td>
</tr>
<tr>
<td class="calDay" align="center"><span class="calFuture">29</span></td>
</tr>
</table>
</div>
<div class="panelComp">
</div>
</div>
</div>

its long because of the calendar
elpocho
02-22-2004, 11:32 PM
because of the calendar
salomeyasobko
02-22-2004, 11:33 PM
wait what do you mean by "i found the scrollbar so don't worry about it".. do you mean you figured out how to do it and don't need help anymore?

nvm i get it :D


by the way, use the EDIT button if you want to say something else!
elpocho
02-22-2004, 11:34 PM
just one of the 3 questions sorry if i wasn't clear
salomeyasobko
02-22-2004, 11:36 PM
for borders, change what you wrote for borders to this [wherever you want the borders to be, like in the body section or header section or whatever] & edit the bold parts:

border: 1pt solid #COLOR

hope that works! :)
elpocho
02-22-2004, 11:37 PM
ok

i try it

if you want to see my site here it is (http://www.rockysworld.tk)

im switching from just plain html to css

Please use the edit button within 5 minutes of posting. --Moderator
elpocho
02-22-2004, 11:39 PM
i try it

if you want to see my site here it is (http://www.rockysworld.tk)

im switching from just plain html to css