hey, its me again,<br />
<br />
i got a few questions, when using css are you supposed to avoid using <br> ?? and two, what can i use to a "table" or "layout box" at the very bottom. if you go to my site you can c it, but i have to use a lot of <br>'s. plus it if i add new info in one box, i would have to keep changing the px's on the bottom box. it's very hard to explain, here's the CSS code, go to my site and you will c what i mean<br />
I just want to make sure im doing this right, cause i dont want to have to be chaing it constantly.<br />
------------------cp.css<br />
<br />
#title {position: absolute; top: 0px; right: 2%; left: 1%; background:Black; width: 100%}<br />
<br />
#bar1 {position: absolute; top: 78px; left: 1%; <br />
background:#00a8ec url(blue143.jpg) ; width: 100%; border-top: 1px solid black; border-left: 1px solid black; border-bottom: 1px solid black; border-right: 1px solid black;}<br />
<br />
<br />
#nav {position: absolute; top: 100px; left: 1%; background:009cda; border-top: 2px solid black; border-left: 2px solid black; border-bottom: 2px solid black; border-right: 2px solid black; width: 15%}<br />
#nav a {display:block;}<br />
#nav a:visited {color:121212; background:009cda; font-weight: bold; text-decoration: none; border-bottom: 1px solid black; border-left: 1px solid black; border-top: 1px solid black}<br />
#nav a:link {color:black; font-weight: bold; text-decoration: none; border-bottom: 1px solid black; border-left: 1px solid black; border-top: 1px solid black;}<br />
#nav a:hover {background-color: black; font-weight: bold; color:white; text-decoration:underline}<br />
<br />
li {list-style-type:none;}<br />
<br />
<br />
#right {position: absolute; top: 234px; left: 1%; background:#00a8ec url(blue007.jpg); border-top: 2px solid Black; border-left: 2px solid Black; border-bottom: 2px solid Black; border-right: 2px solid Black; width: 15%}<br />
<br />
<br />
#main {position: absolute; top: 101px; left: 16%; background:Black; width: 64%; border-right: 3px solid #00a8ec; border-left: 3px solid #00a8ec; border-bottom: 3px outset #00a8ec;}<br />
<br />
#main a:visited {color:c0c0c0; background:transparent; font-weight: bold; text-decoration: none;}<br />
#main a:link {color:6ec6f1; font-weight: bold; text-decoration: none;}<br />
#main a:hover {background-color: black; font-weight: bold; color:white; text-decoration:underline}<br />
<br />
#main h1,h2{font-family:"Arial Black", sans-serif; color: ebf5fc; font-weight:normal;}<br />
<br />
<br />
<br />
#ad {position: absolute; top: 100px; left: 79%; padding: 1px; width: 20.5%; border-top: 2px solid black; border-left: 2px solid black; border-bottom: 2px solid black; border-right: 2px solid black; background:#00a8ec url(blue007.jpg)}<br />
<br />
#footer {position: absolute; right: 2%; left: 1%; width: 100%; border-top: 1px solid black; border-left: 1px solid black; border-bottom: 1px solid black; border-right: 1px solid black; background:#00a8ec url(lblue055.gif); margin-top: 90.5%; }<br />
<br />
<br />
--------------<br />
<br />
<br />
<!-- m --><a class="postlink" href="http://www.freewebs.com/cptestcentral/">http://www.freewebs.com/cptestcentral/</a><!-- m --><br />
<br />
----<br />
Thanks again<br />
<br />
<br />
---
<!--content-->It is a lil bit off in mozilla. Basically yes, avoid the br tag for layout. The br is fine if it is being used as a line break for text, I use it all the time for that, but to be used for positioning is a nono becuase it depends on the font size which may be determined by the user. Instead use margin-top and margin-bottom to space inbetween your elements. For menus and content like that you might consider relative positioning.<!--content-->I think all your absolute positioning is getting you. I'd recommend you start out with the Layout-o-Matic (<!-- m --><a class="postlink" href="http://www.inknoise.com/experimental/layoutomatic.php">http://www.inknoise.com/experimental/layoutomatic.php</a><!-- m -->) and do your changes from there.<!--content-->wow, whoever thought of that is a genius, thx guys!<!--content-->
<br />
i got a few questions, when using css are you supposed to avoid using <br> ?? and two, what can i use to a "table" or "layout box" at the very bottom. if you go to my site you can c it, but i have to use a lot of <br>'s. plus it if i add new info in one box, i would have to keep changing the px's on the bottom box. it's very hard to explain, here's the CSS code, go to my site and you will c what i mean<br />
I just want to make sure im doing this right, cause i dont want to have to be chaing it constantly.<br />
------------------cp.css<br />
<br />
#title {position: absolute; top: 0px; right: 2%; left: 1%; background:Black; width: 100%}<br />
<br />
#bar1 {position: absolute; top: 78px; left: 1%; <br />
background:#00a8ec url(blue143.jpg) ; width: 100%; border-top: 1px solid black; border-left: 1px solid black; border-bottom: 1px solid black; border-right: 1px solid black;}<br />
<br />
<br />
#nav {position: absolute; top: 100px; left: 1%; background:009cda; border-top: 2px solid black; border-left: 2px solid black; border-bottom: 2px solid black; border-right: 2px solid black; width: 15%}<br />
#nav a {display:block;}<br />
#nav a:visited {color:121212; background:009cda; font-weight: bold; text-decoration: none; border-bottom: 1px solid black; border-left: 1px solid black; border-top: 1px solid black}<br />
#nav a:link {color:black; font-weight: bold; text-decoration: none; border-bottom: 1px solid black; border-left: 1px solid black; border-top: 1px solid black;}<br />
#nav a:hover {background-color: black; font-weight: bold; color:white; text-decoration:underline}<br />
<br />
li {list-style-type:none;}<br />
<br />
<br />
#right {position: absolute; top: 234px; left: 1%; background:#00a8ec url(blue007.jpg); border-top: 2px solid Black; border-left: 2px solid Black; border-bottom: 2px solid Black; border-right: 2px solid Black; width: 15%}<br />
<br />
<br />
#main {position: absolute; top: 101px; left: 16%; background:Black; width: 64%; border-right: 3px solid #00a8ec; border-left: 3px solid #00a8ec; border-bottom: 3px outset #00a8ec;}<br />
<br />
#main a:visited {color:c0c0c0; background:transparent; font-weight: bold; text-decoration: none;}<br />
#main a:link {color:6ec6f1; font-weight: bold; text-decoration: none;}<br />
#main a:hover {background-color: black; font-weight: bold; color:white; text-decoration:underline}<br />
<br />
#main h1,h2{font-family:"Arial Black", sans-serif; color: ebf5fc; font-weight:normal;}<br />
<br />
<br />
<br />
#ad {position: absolute; top: 100px; left: 79%; padding: 1px; width: 20.5%; border-top: 2px solid black; border-left: 2px solid black; border-bottom: 2px solid black; border-right: 2px solid black; background:#00a8ec url(blue007.jpg)}<br />
<br />
#footer {position: absolute; right: 2%; left: 1%; width: 100%; border-top: 1px solid black; border-left: 1px solid black; border-bottom: 1px solid black; border-right: 1px solid black; background:#00a8ec url(lblue055.gif); margin-top: 90.5%; }<br />
<br />
<br />
--------------<br />
<br />
<br />
<!-- m --><a class="postlink" href="http://www.freewebs.com/cptestcentral/">http://www.freewebs.com/cptestcentral/</a><!-- m --><br />
<br />
----<br />
Thanks again<br />
<br />
<br />
---
<!--content-->It is a lil bit off in mozilla. Basically yes, avoid the br tag for layout. The br is fine if it is being used as a line break for text, I use it all the time for that, but to be used for positioning is a nono becuase it depends on the font size which may be determined by the user. Instead use margin-top and margin-bottom to space inbetween your elements. For menus and content like that you might consider relative positioning.<!--content-->I think all your absolute positioning is getting you. I'd recommend you start out with the Layout-o-Matic (<!-- m --><a class="postlink" href="http://www.inknoise.com/experimental/layoutomatic.php">http://www.inknoise.com/experimental/layoutomatic.php</a><!-- m -->) and do your changes from there.<!--content-->wow, whoever thought of that is a genius, thx guys!<!--content-->