Webmasters: Help. My s with CSS aren’t working. it’s making me crazy. Please look at my code. (Never mind – doing something else)

—– Edited to add: Never mind, I’ve decided to do something else. —–

I am probably going to embarrass myself by showing my ignorance. But, I have learned the best stuff by making mistakes. I just learned about using <div> with CSS two weeks ago. I redid my website by splitting it up into a header, footer, right, left  and center. Before, everything was in the middle.

I already have a blog Here where I’ve been talking about redoing my whole website. I’m posting this new blog entry to have room to show my code.

I’m trying to redo the header of my site as it exists right now Here. I want to move my banner up to the top left corner and move the Google search to the top right corner. Doing that will scoot up the table of contents so more of it shows without scrolling. This is what it looks like now:

image

I got my website to the point it is now. Then, I thought I could split the header into three additional sections to show:

|banner|     title     |search|

It is not working. But, my little brain thinks it should work. This is what I get:

image

Please glance at my code and tell me if anything jumps out at you. (please ignore my crackpot ideas, thank you)

My existing style sheet is Here. I’m adding the three sections below to it:

CSS:

 

{
#banner
float: left;
width: 240px;
margin: 1px;
padding: 1em;
}

{
#title
margin-left: 280px;
border-left: 1px solid gray;
margin-right: 280px;
border-right: 1px solid gray;
padding: 1em;
}

{
#search
float: right;
width: 240px;
margin: 1px;
padding: 1em;
}

 

My existing index.html is Here. I’m adding code to split up the top <div> into three sections with this:

 

<div id="top">

<div id="banner">

<a title="Home" href="index.html" target=""><img title="Home" border="0" alt="X-Evolutionist.com Banner" src="banner-

smaller.jpg" width="252" height="39"></a>

</div>

<div id="search">

<!—Search Google –>
<TABLE bgcolor="#99ccff" cellspacing="0" border="1">
<tr valign="middle">
<td>
<form method="get" action="http://www.google.com/search" target="_blank">
<input type="text" name="q" size="20" maxlength="255" value="">
<input type="submit" name="sa" value="Search">
<input type="hidden" name="domains" value="x-evolutionist.com">
<input type="hidden" name="sitesearch" value="x-evolutionist.com">

</form>
</td>
</tr>
</TABLE>
<!– Search Google –>

</div>

<div id="title">

<h1 align="center">Reasons Why I Believe in God</h1>

</div>

</div>

 

If you PM your email address, I’ll send you the revised index.html and style-sheet.css with the code I’ve added.

Thank you bunches for any help.

X

Share with Twitter, Facebook, MySpace, StumbleUpon, etc

5 Comments

Filed under Life

5 responses to “Webmasters: Help. My s with CSS aren’t working. it’s making me crazy. Please look at my code. (Never mind – doing something else)

  1. Ed

    I\’ve copied your code into dreamweaver and it looks like you have it set up as a table with only rows and no columns. If you want to have 3 things at the top then you need to add 2 more columns to the table. So, this would mean in Column 1 (Left) you\’d put the code for your search box. In Column 2 (Center) you\’d have your title and in Column 3 (Right) you\’d have room for something else. You can see what it should look like here:http://cid-69e68647fe8e66ce.skydrive.live.com/self.aspx/New%20folder/Tables.PNGAnd the code:http://cid-69e68647fe8e66ce.skydrive.live.com/self.aspx/New%20folder/Table%20code.PNGHope this helps

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s