Coding help?

Bojangles · 22-02-2008, 03:35 PM

K well I suck at coding but I tried to code my sites offline page.
This is it: http://igoboy.com/offline/

Now when I sliced the page I made a slice inside the grey box to use for typing.
When I go to type in there everything messes up :S
Can anyone tell me why?

Thread moved from web design by --ss-- (Forum Super Moderator): Please post in the correct section .

**--ss--** · 22-02-2008, 03:39 PM

The bit you want to write ontop of has to be in the background of the <td>/<tr> lol

.

Originally Posted by iGOboy

K well I suck at coding but I tried to code my sites offline page.
This is it: http://igoboy.com/offline/

Now when I sliced the page I made a slice inside the grey box to use for typing.
When I go to type in there everything messes up :S
Can anyone tell me why?

Bojangles · 22-02-2008, 03:48 PM

Originally Posted by --ss--

The bit you want to write ontop of has to be in the background of the <td>/<tr> lol

.

So how would I fix this?

kk. · 22-02-2008, 03:56 PM

here you go, i wrote a mini page for you.

HTML Code:

<!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" />
<title>Untitled Document</title>
</head>

<style type="text/css">

#box {
    border: 1px solid #999999;
    width: 350px;
    margin-right: auto;
    margin-left: auto;
    height: 20px;
    background-color: #F0F0F0;
    padding: 4px;
}
#logo {
    margin-right: auto;
    margin-left: auto;
    width: 500px;
    height: 100px;
}

</style>


<body>
<div id="logo">
  <div align="center"><img src="http://igoboy.com/offline/images/banner.gif" width="444" height="81" /></div>
</div>
<div id="box"></div>
</body>
</html>

the way you should have done it was by using a border rather than slicing a lyout because all it is is one box with a border (with the image above the table)

Bojangles · 22-02-2008, 05:20 PM

Woah thanks josh!

+REP!

kk. · 22-02-2008, 05:22 PM

no problem, i like helping out

Bojangles · 22-02-2008, 05:24 PM

Thanks a bunch

It works too
www.igoboy.com/offline
I really need to stop using tables

**--ss--** · 22-02-2008, 07:11 PM

Originally Posted by JimboJosh

here you go, i wrote a mini page for you.

HTML Code:

<!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" />
<title>Untitled Document</title>
</head>

<style type="text/css">

#box {
    border: 1px solid #999999;
    width: 350px;
    margin-right: auto;
    margin-left: auto;
    height: 20px;
    background-color: #F0F0F0;
    padding: 4px;
}
#logo {
    margin-right: auto;
    margin-left: auto;
    width: 500px;
    height: 100px;
}

</style>


<body>
<div id="logo">
  <div align="center"><img src="http://igoboy.com/offline/images/banner.gif" width="444" height="81" /></div>
</div>
<div id="box"></div>
</body>
</html>

the way you should have done it was by using a border rather than slicing a lyout because all it is is one box with a border (with the image above the table)

This line isn't needed in the code:

Code:

<div align="center"><img src="http://igoboy.com/offline/images/banner.gif" width="444" height="81" /></div>

You can do all that by changing the logo's CSS too :

HTML Code:

#logo {
  height: 81px;
  width: 444px;
  margin: auto;
  background-image: url(images/banner.gif);
  text-align: center;
}

Bojangles · 22-02-2008, 07:25 PM

Haha thanks very much

kk. · 24-02-2008, 01:39 PM

Originally Posted by --ss--

This line isn't needed in the code:

Code:

<div align="center"><img src="http://igoboy.com/offline/images/banner.gif" width="444" height="81" /></div>

You can do all that by changing the logo's CSS too :

HTML Code:

#logo {
  height: 81px;
  width: 444px;
  margin: auto;
  background-image: url(images/banner.gif);
  text-align: center;
}

lol i know, it also makes it so if someone wanted the image theyd have to go rummaging through the source code but it makes it clear to him where the image came from

Thread: Coding help?

Thread Tools

Coding help?

Posting Permissions