BachusII on Sep 6, 2005 at 12:26:41 PM (# 2)
This message has been edited.Quick fix, set each and every size to fixed dimensions so it matches the background image (menu.jpg). Better fix, rethink the layout and go for a more fluid design. Match the imagery to the text, not vice versa.
mindjuju on Sep 6, 2005 at 1:39:08 PM (# 3)Hey, i only had about 15 minutes of lunch left to help you out here, so the CSS code isn't perfect, you'll want to go back and get it right.
Here is what your code should look like: (save that HTML/CSS code to a htm file and put the background picture menu.jpg in that same directory. everything should come up right).
You'll notice big differences between your HTML code and mine. The more I study CSS, the more powerful I realize it is. The problem is though, in order to use CSS, you have to forget using HTML as markup, use CSS instead. Might i recommend www.csszengarden.com for illustrations of how powerful CSS is.
M
<html>
<head>
<title>ScrewYouBuddy.net - Get Your Dose of Attitude, Here!</title>
<style type="text/css"><!--
body {font-family:Verdana; font-size:12px; background:#222; text-align: center;}
h2 {font-family:Verdana; font-size:22px; font-weight:bold}
h3 {font-family:Verdana; font-size:10px; font-weight:bold; color:#E35803}
a:link,a:active,a:visited {color:#000000; font-weight:bold}
a:hover {color:#E35803; font-weight:bold}
.title {font-family:Verdana; font-size:17px; font-weight:bold}
.splash {width:680px; height:600px; background: url(menu.jpg) no-repeat; padding-bottom:5px; padding-right:5px; margin-top:50px;}
.navbar {width:171px; height:382; float:left; postion: relative; margin-top:208px; margin-left:4px; padding:10px; text-align: left;}
.displaytext {width:458px; height:382; float:right; postion: relative; margin-top:208px; margin-right:4px; padding:10px; text-align: left;}
--></style>
</head>
<body>
<div class="splash">
<div class="navbar">
<b class="title"></b>
· <a href="index.html">Home</a><br>
· <a href="meet.html">Meet the Writers</a><br>
· <a href="rants.html">Read the Rants</a><br>
· <a href="reviews.html">Reviews</a><br>
· <a href="http://s13.invisionfree.com/thekettle/">Forum</a><br>
</div>
<div class="displaytext">
<B>
As stated above, this is the new highly opinionated, tongue-in-cheek rant website.
There are many things in this world that tend to piss us off and our staff will be writing
about things that personally tick them off. You can also suggest a topic for the writers by contacting them through e-mail or
the forum.<BR>
Join our forum and you can discuss the rants with the writers and other members of the forum. Why did we name the forum
"The Oversized Tea Kettle"? Because it's ridiculous and goofy, and so are we. The rants on here will be ranging from
anything serious to anything absolutely absurd. Whatever our staff wants to write about basically.<BR>
Please be patient
as we try and get the site finished and ready to go. But for now just join our
<a href="http://s13.invisionfree.com/thekettle/">Forum</a> and stick around.</p>
</B>
</div>
</div>
</body>
</html>
BachusII on Sep 6, 2005 at 2:07:06 PM (# 4)> ... you have to forget using HTML as markup, ... Wrong choice of words here, remember it's HyperText Markup Language. More apropriate would be ... you have to forget using HTML as markup for presentation, ....
And I second the suggestion to take a look at CSSZenGarden.com.
mindjuju on Sep 6, 2005 at 2:31:13 PM (# 5)ah! I was pressed for time and trying to get it posted and overlooked that. Thanks for correcting that important point.
M
Jack Turk on Sep 6, 2005 at 5:01:12 PM (# 6)> "The Oversized Tea Kettle"
Milk, no sugar please.
philcha on Sep 7, 2005 at 1:53:47 AM (# 7)
This message has been edited.glish.com has a lot of CSS techniques and tips.
Roffy on Sep 7, 2005 at 8:01:37 AM (# 8)Thanks everyone, I will look into it. Unfortunately my computer at home decided to die on me so my website is on hold for a bit. But I do appreciate it, and Holophrastic, I will try and help others out as well if I can...
| 
CSS Layout issue with screen resolution