Velocity Reviews - Problem with banner

Velocity Reviews (http://www.velocityreviews.com/forums/index.php)

- HTML (http://www.velocityreviews.com/forums/f31-html.html)

- - Problem with banner (http://www.velocityreviews.com/forums/t164334-problem-with-banner.html)

Problem with banner

Hello everyone,

I'm attempting to create my first website, and I'm also trying to learn
how to use CSS. I created a website, and have done what I consider to
already be some substantial work on it. However, I'm having a problem with
the banner and another banner type pic that I have.

On my main PC in IE, it displays about as I want it. There is some
padding around the site that I don't know why it's there. When I view the
page using Firefox, the page overflows some to the right causing a
horizontal scrollbar to appear.

On my laptop and on other PCs I've checked my site out on, the
horizontal scroll bar always appears because of the overflow.

There is a lot of code already written so I guess I'll just post my
<body> and my code for the CSS. The address of the site is www.decadre.com

BODY CODE

<div id="Masthead">
<IMG SRC="uipics/Decadre_Logo.jpg" WIDTH="100%" HEIGHT="150" BORDER="0"
ALT="">
</div>
<div id="NavBtnBck">
<IMG SRC="uipics/NavBtnBck.gif" WIDTH="100%" HEIGHT="50" BORDER="0" ALT="">
</div>
<div id="NavBtn">
<TABLE>
<TR>
<TD><A HREF="index.html"><IMG SRC="uipics/HomeDown.gif" WIDTH="125"
HEIGHT="35" BORDER="0" ALT="Home"></A></TD>
<TD><A HREF="Games.html" onMouseover="document.GameBtn.src=GameHvr.src"
onMouseout="document.GameBtn.src=GameUp.src"><IMG SRC="uipics/GameUp.gif"
WIDTH="125" HEIGHT="35" BORDER="0" NAME="GameBtn" ALT="Games"></A></TD>
<TD ><A HREF="Jokes.html" onMouseover="document.JokeBtn.src=JokeHvr.src"
onMouseout="document.JokeBtn.src=JokeUp.src"><IMG SRC="uipics/JokesUp.gif"
WIDTH="125" HEIGHT="35" BORDER="0" NAME="JokeBtn" ALT="Jokes"></A></TD>
<TD><A HREF="Pictures.html"
onMouseover="document.PicsBtn.src=PicsHvr.src"
onMouseout="document.PicsBtn.src=PicsUp.src"><IMG SRC="uipics/PicsUp.gif"
WIDTH="125" HEIGHT="35" BORDER="0" NAME="PicsBtn" ALT="Pictures"></A></TD>
<TD><A HREF="Programming.html"
onMouseover="document.ProgBtn.src=ProgHvr.src"
onMouseout="document.ProgBtn.src=ProgUp.src"><IMG SRC="uipics/ProgUp.gif"
WIDTH="125" HEIGHT="35" BORDER="0" NAME="ProgBtn"
ALT="Programming"></A></TD>
<TD><A HREF="Links.html" onMouseover="document.LinkBtn.src=LinkHvr.src"
onMouseout="document.LinkBtn.src=LinkUp.src"><IMG SRC="uipics/LinksUp.gif"
WIDTH="125" HEIGHT="35" BORDER="0" NAME="LinkBtn" ALT="Links"></A></TD>
<TD><A HREF="Misc.html" onMouseover="document.MiscBtn.src=MiscHvr.src"
onMouseout="document.MiscBtn.src=MiscUp.src"><IMG SRC="uipics/MiscUp.gif"
WIDTH="125" HEIGHT="35" BORDER="0" NAME="MiscBtn"
ALT="Credits/About"></A></TD>
</TR>
</TABLE>
</div>
<div id="NavList">
<IMG SRC="uipics/HomePage.gif" WIDTH="125" HEIGHT="125" BORDER="0"
HSPACE="0" ALT="Home Page Links">
<ul>
<li><A HREF="EQ2.html"> Games </A></li><br>
<li><A HREF="Jokes.html"> Jokes </A></li><br>
<li><A HREF="Pictures.html"> Pictures </A></li><br>
<li><A HREF="Programming.html"> Programming </A></li><br>
<li><A HREF="Links.html"> Links </A></li><br>
<li><A HREF="Misc.html"> Credits/About </A></li><br>
</ul>
</div>
<div id="Content">
JAVA CODE HERE (edited out for space)
</div>
</BODY>

CSS CODE

body{background-color: #ffffff;
}

#Content{
margin: 225px 0 0 175px;
position: absolute;
}

#Masthead{
position:absolute;
margin: 0 0 0 0;
}

#NavBtn{
position:absolute;
margin: 153 0 0 10%;
}

#NavBtnBck{
position:absolute;
margin: 150 0 0 0;
}

#NavList{
background-color: #3399FF;
border: 2px outset #000000;
height: 450px;
margin: 200px 0 0 0;
position: absolute;
width:150px;
}

Re: Problem with banner

Decadre wrote:

> Hello everyone,
>
> I'm attempting to create my first website, and I'm also trying to
> learn
> how to use CSS. I created a website, and have done what I consider to
> already be some substantial work on it. However, I'm having a problem with
> the banner and another banner type pic that I have.
>
> On my main PC in IE, it displays about as I want it. There is some
> padding around the site that I don't know why it's there. When I view the
> page using Firefox, the page overflows some to the right causing a
> horizontal scrollbar to appear.
>
> On my laptop and on other PCs I've checked my site out on, the
> horizontal scroll bar always appears because of the overflow.
>
> There is a lot of code already written so I guess I'll just post my
> <body> and my code for the CSS. The address of the site is www.decadre.com

Not answering the question, but my computer doesn't have a Java runtime and
your site displays "Java is enabled". Perhaps you mean (ECMA|Java)script?

Re: Problem with banner

oh no clue, that was code I stole and never took out when I couldn't figure
out why the buttons weren't working originally. I should yank it out, but
I've been pulling my hair out trying to get the CSS figured out for the
banner (graphics) up top. In first the last time I thought of it in a long
time was when copying an pasting it here.

"Jim Higson" <jh@333.org> wrote in message
news:hvmdnTTp48vsTZ_ZRVnyvQ@eclipse.net.uk...
> Decadre wrote:
>
>> Hello everyone,
>>
>> I'm attempting to create my first website, and I'm also trying to
>> learn
>> how to use CSS. I created a website, and have done what I consider to
>> already be some substantial work on it. However, I'm having a problem
>> with
>> the banner and another banner type pic that I have.
>>
>> On my main PC in IE, it displays about as I want it. There is some
>> padding around the site that I don't know why it's there. When I view the
>> page using Firefox, the page overflows some to the right causing a
>> horizontal scrollbar to appear.
>>
>> On my laptop and on other PCs I've checked my site out on, the
>> horizontal scroll bar always appears because of the overflow.
>>
>> There is a lot of code already written so I guess I'll just post my
>> <body> and my code for the CSS. The address of the site is
>> www.decadre.com
>
> Not answering the question, but my computer doesn't have a Java runtime
> and
> your site displays "Java is enabled". Perhaps you mean (ECMA|Java)script?
>

Re: Problem with banner

Decadre wrote:

> I'm attempting to create my first website, and I'm also trying to learn
> how to use CSS.

Not bad, now try it again without _any_ Java or JavaScript involved.
It's easier and better.

You don't need JavaScript for menu rollovers. Look at how to do it with
:hover and CSS instead (searching will show lots of tutorials).

Re: Problem with banner

Decadre wrote:
>
> On my main PC in IE, it displays about as I want it. There is some
> padding around the site that I don't know why it's there. When I view the
> page using Firefox, the page overflows some to the right causing a
> horizontal scrollbar to appear.
>
> On my laptop and on other PCs I've checked my site out on, the
> horizontal scroll bar always appears because of the overflow.
>
The reason for the scroll bar is because you logo image is 1280 pixels
wide. Unless the viewport is wider than that, you get a scroll bar.
Also the horizontal menu is quite wide, about 900 pixels.
You must be viewing your site on a 1600x1200 monitor at fullscreen to
not need any scrolling. IE6 has a scroll bar when I view your site.

Decide on which DTD to use. You have mashed HTML and XHTML together both
in the doctype and the code. For the most consistent results across
browsers, use HTML 4.01 Strict. Drop the <?xml ...> altogether.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

Validate your code: <http://validator.w3.org/>
The top header is not a masthead. You should use (and style) <h1> for a
page's primary header.
What padding? Each browser has its own defaults for the various HTML
elements. All margins and paddings are mutable; use CSS to specify what
you want.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

Re: Problem with banner

Thx everyone for responding, I'll try everyone's suggestion and give it a go
around

"Jim Moe" <jmm-list.AXSPAMGN@sohnen-moe.com> wrote in message
news:99GdnY_bk_e4z57ZRVn-rA@giganews.com...
> Decadre wrote:
>>
>> On my main PC in IE, it displays about as I want it. There is some
>> padding around the site that I don't know why it's there. When I view the
>> page using Firefox, the page overflows some to the right causing a
>> horizontal scrollbar to appear.
>>
>> On my laptop and on other PCs I've checked my site out on, the
>> horizontal scroll bar always appears because of the overflow.
>>
> The reason for the scroll bar is because you logo image is 1280 pixels
> wide. Unless the viewport is wider than that, you get a scroll bar.
> Also the horizontal menu is quite wide, about 900 pixels.
> You must be viewing your site on a 1600x1200 monitor at fullscreen to
> not need any scrolling. IE6 has a scroll bar when I view your site.
>
> Decide on which DTD to use. You have mashed HTML and XHTML together both
> in the doctype and the code. For the most consistent results across
> browsers, use HTML 4.01 Strict. Drop the <?xml ...> altogether.
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
> "http://www.w3.org/TR/html4/strict.dtd">
>
> Validate your code: <http://validator.w3.org/>
> The top header is not a masthead. You should use (and style) <h1> for a
> page's primary header.
> What padding? Each browser has its own defaults for the various HTML
> elements. All margins and paddings are mutable; use CSS to specify what
> you want.
>
> --
> jmm (hyphen) list (at) sohnen-moe (dot) com
> (Remove .AXSPAMGN for email)