The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Positioning and other problems, See above.
tharpdevenport
post Oct 23 2007, 05:58 PM
Post #1


Advanced Member
****

Group: Members
Posts: 201
Joined: 25-October 06
Member No.: 571



Here is the code:

CODE
<script language="javascript" src="http://banner.0catch.com/cgi-bin/popup_mainsite.js"></script>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>hewhohasnoname</TITLE>
<NOBANNER>

<STYLE type="text/css">
BODY { scrollbar-arrow-color: blue; scrollbar-Track-Color: 87CEFA; margin: 0px; background-image: url(_webimages/clouds2.gif); PADDING: 0px; Margin: 0px; }

#SOL { BORDER: 0px; PADDING: 0px; POSITION: relative; }
#SOL A { BORDER: 0px; COLOR: ff9900; text-align: center; font-weight: bold; text-decoration: none; PADDING-TOP: 35%; }
#SOL A:hover { COLOR: yellow; font-weight: bold; }
#BB { BACKGROUND-IMAGE: url(_webimages/BlueBallGIF.gif); HEIGHT: 66px; WIDTH: 65px; font-size: 20px; letter-spacing: 5px; LEFT: 0px; POSITION: absolute; background-repeat: no-repeat; text-indent: 10px; }
#O { font-weight: bold; COLOR: ff9900; }

#SCROLL { Border-left: #DCDCDC 2px solid; Border-top: #DCDCDC 2px solid; Border-bottom: #DCDCDC 2px solid; Border-right: 0px; display: block; Width: 100%; Height: 200px; Margin: 0px; Padding: 10px; background: f5f5f5; color: black;  overflow: auto; scrollbar-arrow-color:#000000; scrollbar-base-color:#C0C0C0; scrollbar-3dlight-color:#000000; scrollbar-darkshadow-color:#000000; scrollbar-highlight-color: silver; scrollbar-shadow-color:#f5f5f5; font-family: times new roman; Font-size: 18px; text-wrap: wrap; }

#P { PADDING: 0px; }
.BAR { background-color: #f5f5f5; Height: 30px; }
.C1 { background-image: url(images/LCTop.gif); background-repeat: no-repeat; }
.C2 { background-image: url(images/LCBot.gif); background-repeat: no-repeat; }</STYLE>

<META http-equiv="Content-Type" Content="text/html; charset=ISO-8859-1">
</HEAD>
<BODY>


<IMG style="LEFT: 130px; POSITION: absolute; TOP: 20px" src="/images/hewhohasnonameName.gif" border="0">

<DIV id=SOL><A id="BB" style="LEFT: 60px; TOP: 105px" href="/hewhohasnonamenews.html">News</A></DIV>
<DIV id="SOL"><A id="BB" style="LEFT: 40px; TOP: 178px" href="/hewhohasnonameCDs.html">CDs</A></DIV>
<DIV id=SOL><A id="BB" style="LEFT: 30px; TOP: 250px" href="/hewhohasnonamenews.html">Resume</A></DIV>
<DIV id=SOL><A id="BB" style="LEFT: 40px; TOP: 323px" href="/hewhohasnonameaudio.html">Audio</A></DIV>
<DIV id="SOL"><A id="BB" style="LEFT: 60px; TOP: 397px" href="mailto:lesley@whateveragency.com" A>Contact</A></DIV>

<P align="right">
<TABLE style="Position: absolute; Top: 25%; Right: 0px; Width: 650px" cellSpacing="0" cellPadding="0" border="0">
<TBODY>
<TR>
<TD class="C1"></TD>
<TD class="BAR"></TD></TR>
<TR>
<TD width="30" bgcolor="#f5f5f5"></TD>
<TD><DIV id="SCROLL">
<SPAN style="FONT-WEIGHT: bold; COLOR: #ff9900; TEXT-DECORATION: underline overline">Biography&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</SPAN> <BR>
<BR>
&nbsp;&nbsp;&nbsp;&nbsp;So and so was born the day before yesterday...
<BR>
<BR>
<UL type="circle">
<LI>Stuff</LI></UL>
</DIV></TD></TR>
<TR>
<TD class="C2"></TD>
<TD class="BAR"></TD></TR>
</TBODY></TABLE>
</P>


</BODY>
</HTML>



There are five "blue balls" positioned on the left in such a way where it looks like they areorbiting a big circle (that isn't there).

I wanted the same for another page, except they are on hte right, in a mirror reflection, but it's not working:

CODE

<script language="javascript" src="http://banner.0catch.com/cgi-bin/popup_mainsite.js"></script>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>hewhohasnoname's Audio Samples</TITLE>
<NOBANNER>

<STYLE type="text/css">
#SOL { BORDER: 0px; PADDING: 0px; POSITION: relative; }
#SOL A { BORDER: 0px; COLOR: ff6347; text-align: right; font-weight: bold; text-decoration: none; PADDING-TOP: 35%; }
#SOL A:hover { COLOR: yellow; font-weight: bold; }

.BB { BACKGROUND-IMAGE: url(_webimages/BlueBallGIF.gif); HEIGHT: 66px; WIDTH: 65px; Font-size: 20px; Letter-spacing: 5px; POSITION: absolute; RIGHT: 0px; background-repeat: no-repeat; Text-indent: 10px; }

#O { font-weight: bold; COLOR: ff6347; }

#SCROLL { Display: block; Position: absolute; LEFT: 0px; Bottom: 0px; Width: 620px; Height: 370px; Margin: 0px; Padding: 20px; Background: f5f5f5; Color: inherit;  overflow: auto; Border: #DCDCDC 2px solid; scrollbar-arrow-color:#000000; scrollbar-base-color:#C0C0C0; scrollbar-3dlight-color:#000000; scrollbar-darkshadow-color:#000000; scrollbar-highlight-color: silver; scrollbar-shadow-color:#f5f5f5; font-family: times new roman; Font-size: 18px; text-wrap: wrap; }

BODY { scrollbar-arrow-color: blue; scrollbar-Track-Color: 87CEFA; Margin: 0px; background-image: url(_webimages/clouds2.gif); PADDING: 0px; }
#P { PADDING: 0px; }

.BAR { background-color: #f5f5f5; Height: 30px; }
.C3 { background-image: url(images/RCTop.gif); background-repeat: no-repeat; }</STYLE>

<META http-equiv="Content-Type" Content="text/html; charset=ISO-8859-1">
</HEAD>
<BODY>


<IMG style="LEFT: 130px; POSITION: absolute; TOP: 20px" src="/images/hewhohasnonameAudioLOGO.gif" border="0">

<DIV id="SOL"><A class="BB" style="RIGHT: 60px; TOP: 105px" href="/hewhohasnonamenews.html">News</A></DIV>
<DIV id="SOL"><A class="BB" style="RIGHT: 40px; TOP: 178px" href="/hewhohasnonameCDs.html">CDs</A></DIV>
<DIV id=SOL><A class="BB" style="Right: 30px; TOP: 250px" href="/hewhohasnonamenews.html">Resume</A></DIV>
<DIV id="SOL"><A class="BB" style="Right: 40px; TOP: 323px" href="/hewhohasnonameaudio.html">Audio</A></DIV>
<DIV id="SOL"><A class="BB" style="RIGHT: 60px; TOP: 397px" href="mailto:lesley@whateveragency.com" A>Contact</A></DIV>


<TABLE style="Position: absolute; Bottom: 0px; Left: 0px; Width: 650px; Height: 400px" cellSpacing="0" cellPadding="0" border="0">
<TBODY>
<TR>
<TD class="BAR"></TD>
<TD class="C3"></TD></TR>
<TR>
<TD><DIV id="SCROLL">
<SPAN style="FONT-WEIGHT: bold; COLOR: #ff9900; TEXT-DECORATION: underline overline">Biography&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</SPAN> <BR>
<BR>
&nbsp;&nbsp;&nbsp;&nbsp; Based in Los Angeles,&nbsp; <SPAN id="O">hewhohasnoname</SPAN>&nbsp;has toiled in the film and TV business for many years, primarily behind the scenes, as composer, orchestrator, arranger, and conductor.&nbsp; He has orchestrated for such composers as:
<BR>
<BR>
<UL type="circle">
<LI>Your mama
<BR>
<BR>
<SPAN id="O">ORCHESTRATIONS</SPAN>
<LI>Sure.</LI></UL>
&nbsp;&nbsp;&nbsp;&nbsp; <SPAN id="O">hewhohasnoname</SPAN> composed the score for the upcoming movie:&nbsp; blank.</DIV></TD>
<TD width="30" bgcolor="#f5f5f5"></TD></TR>
<TR>
<TD colspan="2" class="BAR"></TD></TR>
</TBODY></TABLE>

</BODY>
</HTML>



There was a couple other problems, on other pages, but I can't recall them; will post them later.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
tharpdevenport
post Nov 3 2007, 02:08 PM
Post #2


Advanced Member
****

Group: Members
Posts: 201
Joined: 25-October 06
Member No.: 571



Anyone?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Nov 3 2007, 03:38 PM
Post #3


WDG Member
********

Group: Root Admin
Posts: 8,365
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



Can you provide the URL (address) of a document that demonstrates the problem?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
tharpdevenport
post Nov 6 2007, 03:41 PM
Post #4


Advanced Member
****

Group: Members
Posts: 201
Joined: 25-October 06
Member No.: 571



Sent a PM as I want to keep the page private.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
tharpdevenport
post Dec 1 2007, 02:21 PM
Post #5


Advanced Member
****

Group: Members
Posts: 201
Joined: 25-October 06
Member No.: 571



Anyone?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Dec 1 2007, 03:19 PM
Post #6


WDG Member
********

Group: Root Admin
Posts: 8,365
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



Do you still want to keep the page private?

Do you still want to use a hosting provider that breaks your markup, so your page triggers quirks mode?

After deleting the script at the top (added by your hosting provider) and deleting the doctype declaration (you're nowhere near using Strict HTML), I still got a number of errors in your markup. For one thing, id attribute values must be unique within a given document.

You also have a number of CSS errors. And you're using position:absolute which introduces its own problems.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
tharpdevenport
post Dec 4 2007, 02:19 PM
Post #7


Advanced Member
****

Group: Members
Posts: 201
Joined: 25-October 06
Member No.: 571



Yes, want to keep it private still.

I mainly use the 150m.com provider because it's name is short (none of that long bravenet.com stuff in the site address), and I know my way around it quickly, plus ... as far as I know all free sites have pop ups.

Damn, I forgot to clear up the id/class thing; I meant to fix that, but forgot. Did it now.


The DOCTYPES all look pretty much the same to me, when I was reading a page with differet ones; only certain ones that I knew for a fact I wasn't using code from, I knew not to use, but with my knowledge of them, they all blend together. I have no clue on how to pick the right one.


I use position: absolute because I don't recall reading anything about it being wrong to use, and if I use relative, it will put them in the wrong spots.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Dec 4 2007, 02:48 PM
Post #8


WDG Member
********

Group: Root Admin
Posts: 8,365
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



QUOTE
The DOCTYPES all look pretty much the same to me, when I was reading a page with differet ones; only certain ones that I knew for a fact I wasn't using code from, I knew not to use, but with my knowledge of them, they all blend together. I have no clue on how to pick the right one.
There are two main consumers of doctype declarations: validators and browsers. Your hosting provider adds a script element before the doctype declaration, which prevents both validators and browsers from using it. You may as well remove it. If you remove it, then our validator will use HTML 4.01 Transitional by default, which is probably the most appropriate choice given that you aren't ready to move to a Strict DTD.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 16th April 2024 - 01:04 AM