PHWinfo banniere

Titres
PORTAIL ANNUAIRE ARTICLES COMPARATEUR HÉBERGEURS DEVIS FORUMS RÉDUCTEUR D'URL
Précédent   PHWinfo > Autres forums > Forum Programmation & Conception > comp.info.authoring.html > HTML & CSS Problems - Newbie
S'inscrire FAQ Membres Recherche Messages du jour Marquer les forums comme lus
HTML & CSS Problems - Newbie

Réponse
 
LinkBack Outils de la discussion
Vieux 29/03/2008, 06h06   #1
Michael R. Copeland
Aucun Avatar
 
Messages: n/a
Hébergeur:
Par défaut HTML & CSS Problems - Newbie

I am trying to build a prototype Web site, but I am having to learn
many aspects of HTML and CSS as I do. I am completely new to CSS, and
there are a number of HTML tags I don't understand (e.g. <div>, <span>),
but am using some because I've cannabilized some code here. Thus, I
have code that I don't understand and that isn't working... 8<{{
The problems I'm seeing here are:
1. Each menu's item data is progressively shifted to the right. That
is, the "History" paragraphs are fine, but the paragraphs that follow
("Sales", "Photos", "Neighborhood") are shifted/indented. I don't
understand why and don't know how to correct it...
2. The links don't work. I don't know why.
I have tweaked my code to this point, but nothing has worked so far.
Please advise. TIA

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-
type">
<title>Regency House Building</title>
<style type="text/css">
ul1 {
float:left;
width:100%;
padding:0;
margin:0;
list-style-type:none;
}
a {
width:10em;
text-decoration:none;
color:white;
background-color:green;
padding:0.2em 0.6em;
}
a:hover {background-color:#ff3300}
li {display:inline}
b {
color: black;
width:60em;
text-decoration:none;
background-color:brown;
text-indent:1cm;
}
p.margin {margin: 0cm 3cm 0cm 3cm; text-indent:1cm;
}
</style>
</head>
<body style="color: rgb(255, 255, 255); background-color: Brown;"
alink="#ff6600" link="#99ff99" vlink="#990099">
<div style="text-align: center;">
<ul1>
<li><a href="#History">History</a></li>
<li><a href="#Sales">Units for Sale</a></li>
<li><a href="#Photos">Photo Gallery</a></li>
<li><a href="#Neighborhood">The Neighborhood</a></li>
</ul1>
</div>
<br>

<div style="text-align: center; color: black;">
<br><br>
<b><p name="#History" class="margin">Regency House History</div><br>

<div style="text-align: left; color: black;">
<p class="margin">The Regency House was built in 1964, initially as a
luxury apartment building.
Designed by George H. Schonenberger, it was the second high rise
residential building constructed in Phoenix
(Phoenix Towers, built in 1956, was the first).<br>
[...]
<p class="margin">In 2004, after rejecting several attempts to update
and improve the aging interiors of the building, the owners
voted overwhelmingly to accept a comprehensive proposal to redo the
common areas. This plan, done by Copeland Interiors, Inc.,
included all halls and lobbies, as well as the Social Room, Front
Desk/Lobby, and the creation of a Fitness Center in the
unused Library. The project designer oversaw all aspects of this year-
long project, which retained the stately wood interiors,
but added new lighting, carpets, flooring, and completely redesigned the
Front Desk/Lobby.
<p class="margin">The Social Room got special attention, with new
furniture, a grand piano, large screen TV, and stereo. An interesting
aspect used 76 nostalgic photographs obtained from various sources,
including many residents. These photos are used throughout the
building to highlight the city's and neighborhood's history, integrating
the building's fresh, new appearance and the local area's
diverse past. Of special note is the "community effort" this part of
the project assumed, when
many residents worked together to acquire, identify, and prepare these
pictures during a day-long
"framing party" for these pictures.
<p class="margin">Upon completion of the project, it was submitted to
the 2005 ASID North Chapter Professional Awards, where it won First
Place in Commercial Design, as well as Best of Show.<br>[etc.]</b></p>
</div>

<div style="text-align: center; color: black;">
<p><b name="#Sales">Units for Sale<br></p></div>
<div style="text-align: left; color: black;">
<p class="margin">Following is a (non-exaustive) list of condominium
units for sale in the Regency
House (as of 03/16/2008):
<br>[etc.]
</p>
<br></div>

<div style="text-align: center; color: black;">
<p><b name="#Photos">Photos<br></p></div>
<div style="text-align: left; color: black;">
<p class="margin">
<br>[etc.]
</p>
<br></div>

<div style="text-align: center; color: black;">
<p><b name="#Neighborhood">Our Neighborhood<br></p></div>
<div style="text-align: left; color: black;">
<p class="margin">List of schools, churches, shopping, restaurants,
entertainment, and such. Possibly reviews (as appropriate...)
<br>[etc.]
</p>
<br></div>

</body>
</html>
  Réponse avec citation
Vieux 29/03/2008, 07h02   #2
John Hosking
Aucun Avatar
 
Messages: n/a
Hébergeur:
Par défaut Re: HTML & CSS Problems - Newbie

Michael R. Copeland wrote, somewhat impatiently:
> I am trying to build a prototype Web site, but I am having to learn
> many aspects of HTML and CSS as I do. I am completely new to CSS, and
> there are a number of HTML tags I don't understand (e.g. <div>, <span>),
> but am using some because I've cannabilized some code here. Thus, I
> have code that I don't understand and that isn't working... 8<{{


A great opportunity to learn! Too much code copied on the Web over-uses
(or misuses) the div and span elements anyway. Quite possibly, you don't
need them. You ought to at least find out what they do.

Work through a tutorial, such as those at http://www.htmldog.com/guides/
or start getting used to checking (perhaps I should say wading) through
the authoritative if sometimes opaque documents at the W3C:
http://www.w3.org/TR/html401/ for HTML
http://www.w3.org/TR/html401/struct/global.html#h-7.5.4 for div & span
http://www.w3.org/TR/CSS21/ for CSS

> The problems I'm seeing here are:
> 1. Each menu's item data is progressively shifted to the right. That
> is, the "History" paragraphs are fine, but the paragraphs that follow
> ("Sales", "Photos", "Neighborhood") are shifted/indented. I don't
> understand why and don't know how to correct it...
> 2. The links don't work. I don't know why.
> I have tweaked my code to this point, but nothing has worked so far.
> Please advise. TIA


As Blinky said, post a URL. We don't really want to see this much code,
pasted or (mis-)typed into our newsreaders, where we can't really do
anything with it. With a URL, we can click once to open our browsers,
study the page's behavior, use the tools and extensions in the browsers,
and easily validate your code. And validation is the first step when you
see a problem.

>
> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">


This will reliably give you Quirks mode, which is not reliable. See
http://hsivonen.iki.fi/doctype/ and change your doctype to (e.g.)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

> <html><head>


[snippage of code]

> b {
> color: black;
> width:60em;
> text-decoration:none;
> background-color:brown;
> text-indent:1cm;
> }
> p.margin {margin: 0cm 3cm 0cm 3cm; text-indent:1cm;}


Ehh, kind of a silly name for a class. "Margin" is already a property
name. Use class names based on function: "menu", "sidebar", "warning",
etc. What's different about your margin class here from all the rest of
the <p> elements?

> </style>
> </head>
> <body style="color: rgb(255, 255, 255); background-color: Brown;"
> alink="#ff6600" link="#99ff99" vlink="#990099">


Use CSS, in a form similar to:

a { color:#0000ff; }
a:link { color:#99ff99; }
a:visited { color:#990099; }
a:hover { color:#ff0000; }
a:active { color:#ff6600; }

[snippage of code]

>
> <div style="text-align: center; color: black;">
> <br><br>
> <b><p name="#History" class="margin">Regency House History</div><br>


The <b> element is missing its closing tag. The <p> element should have
its name attribute changed to an id attribute.

You don't need the <br> thingies; you can style the vertical spacing
with margin on the p (or padding on the div) with CSS.

[snippage of code]
>
> <div style="text-align: center; color: black;">
> <p><b name="#Sales">Units for Sale<br></p></div>


Again, validating would have caught this error for you.
http://validator.w3.org/ for markup,
http://jigsaw.w3.org/css-validator/ for CSS

I don't see what your divs are for either. What happens when you remove
them (besides your code getting simpler to read and maintain, and faster
to download)?


--
John
Read about the UIP: http://improve-usenet.org/
  Réponse avec citation
Vieux 29/03/2008, 07h19   #3
Blinky the Shark
Aucun Avatar
 
Messages: n/a
Hébergeur:
Par défaut Re: HTML & CSS Problems - Newbie

Michael R. Copeland wrote:

> I am trying to build a prototype Web site, but I am having to learn
> many aspects of HTML and CSS as I do. I am completely new to CSS, and
> there are a number of HTML tags I don't understand (e.g. <div>, <span>),
> but am using some because I've cannabilized some code here. Thus, I have
> code that I don't understand and that isn't working... 8<{{
> The problems I'm seeing here are:
> 1. Each menu's item data is progressively shifted to the right. That
> is, the "History" paragraphs are fine, but the paragraphs that follow
> ("Sales", "Photos", "Neighborhood") are shifted/indented. I don't
> understand why and don't know how to correct it...
> 2. The links don't work. I don't know why.
> I have tweaked my code to this point, but nothing has worked so far.
> Please advise. TIA


Provide a URL.


--
Blinky
Killing all posts from Google Groups
The Usenet Improvement Project: http://improve-usenet.org
Blinky: http://blinkynet.net

  Réponse avec citation
Vieux 29/03/2008, 15h47   #4
Michael R. Copeland
Aucun Avatar
 
Messages: n/a
Hébergeur:
Par défaut Re: HTML & CSS Problems - Newbie

> > I am trying to build a prototype Web site, but I am having to learn
> > many aspects of HTML and CSS as I do. I am completely new to CSS, and
> > there are a number of HTML tags I don't understand (e.g. <div>, <span>),
> > but am using some because I've cannabilized some code here. Thus, I have
> > code that I don't understand and that isn't working... 8<{{
> > The problems I'm seeing here are:
> > 1. Each menu's item data is progressively shifted to the right. That
> > is, the "History" paragraphs are fine, but the paragraphs that follow
> > ("Sales", "Photos", "Neighborhood") are shifted/indented. I don't
> > understand why and don't know how to correct it...
> > 2. The links don't work. I don't know why.
> > I have tweaked my code to this point, but nothing has worked so far.
> > Please advise. TIA

>
> Provide a URL.


I can't. Even though I have contracted with a Web host, I don't want
to upload code that really doesn't work at all. I've been using HTML-
Kit and Internet Explorer & FireFox to view the code, and it looks poor
in both.
I realize that I posted a (too) large amount of code, but it wasn't
until I had this much that I began seeing the problems. If there's a
better way to develop Web code, I'd appreciate learning about it... 8<}}
  Réponse avec citation
Vieux 30/03/2008, 15h56   #5
Andy Dingley
Aucun Avatar
 
Messages: n/a
Hébergeur:
Par défaut Re: HTML & CSS Problems - Newbie

On Sat, 29 Mar 2008 07:47:32 -0700, mrc2323@cox.net (Michael R.
Copeland) wrote:

>> Provide a URL.

>
> I can't.


Of course you can. And until you do, a whole bunch of newsgroup readers
will ignore your posts.

Post a URL
  Réponse avec citation
Vieux 30/03/2008, 21h16   #6
Michael R. Copeland
Aucun Avatar
 
Messages: n/a
Hébergeur:
Par défaut Re: HTML & CSS Problems - Newbie

> >> Provide a URL.
> >
> > I can't.

>
> Of course you can. And until you do, a whole bunch of newsgroup readers
> will ignore your posts.
>
> Post a URL
>

In fairness I don't know what to do: if I am using a WYSIWYG editor
to develop something that isn't on a Web host (because I'm developing a
Web site), how can I post an URL? Since this is (as yet) a non-existant
site, how can do this?
  Réponse avec citation
Vieux 30/03/2008, 21h41   #7
usenetpersongerryt@gmail.com
Aucun Avatar
 
Messages: n/a
Hébergeur:
Par défaut Re: HTML & CSS Problems - Newbie

On Mar 30, 1:16 pm, mrc2...@cox.net (Michael R. Copeland) wrote:
> > >> Provide a URL.
> > > I can't.

> > Of course you can. And until you do, a whole bunch of newsgroup readers
> > will ignore your posts.
> > Post a URL

> In fairness I don't know what to do: if I am using a WYSIWYG editor
> to develop something that isn't on a Web host (because I'm developing a
> Web site), how can I post an URL? Since this is (as yet) a non-existant
> site, how can do this?


Youve been posting since 2004 and you cant sort it out? O my
All the experts here want to see is some sample code.
Surely you can upload it SOMEWHERE and call it something like
http://www.someplace.com/fubar.html??
  Réponse avec citation
Vieux 30/03/2008, 22h05   #8
cf
Aucun Avatar
 
Messages: n/a
Hébergeur:
Par défaut Re: HTML & CSS Problems - Newbie

Of historical note on Sun, 30 Mar 2008 13:16:19 -0700
mrc2323@cox.net (Michael R. Copeland) scribed:

|> >> Provide a URL.
|> >
|> > I can't.
|>
|> Of course you can. And until you do, a whole bunch of newsgroup readers
|> will ignore your posts.
|>
|> Post a URL
|>
| In fairness I don't know what to do: if I am using a WYSIWYG editor
|to develop something that isn't on a Web host (because I'm developing a
|Web site), how can I post an URL? Since this is (as yet) a non-existant
|site, how can do this?

Michael

Place the pages you're working on into a sub-folder that doesn't allow search engine access via a robots.txt in the root. That way you can provide a url to the group but the general public (those outside the group) will never see what you're working on.
<http://www.robotstxt.org/>
<http://www.robotstxt.org/orig.html>

This also allows you to use such online tools as Browsershots and the W3C HTML and CSS validators.
<http://browsershots.org/>

You may also want to look into munging your e-mail address when you post.
<http://www.faqs.org/faqs/net-abuse-faq/munging-address/>

hth
--
cf <cfnews@NOcharterSPAM.net>
I may be dumb, but I'm not stupid.
Terry Bradshaw
  Réponse avec citation
Réponse


Outils de la discussion

Règles de messages
Vous ne pouvez pas créer de nouvelles discussions
Vous ne pouvez pas envoyer des réponses
Vous ne pouvez pas envoyer des pièces jointes
Vous ne pouvez pas modifier vos messages

Les balises BB sont activées : oui
Les smileys sont activés : oui
La balise [IMG] est activée : oui
Le code HTML peut être employé : non
Trackbacks are oui
Pingbacks are oui
Refbacks are oui


Fuseau horaire GMT +1. Il est actuellement 21h17.


Édité par : vBulletin® version 3.7.2
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
Search Engine Friendly URLs by vBSEO 3.2.0 RC5 Tous droits réservés.
Version française #16 par l'association vBulletin francophone
PHWinfo est un site Éducation Sans Frontières
Ad Management by RedTyger
©Tous droits réservés par les parties respectives
Page generated in 0,17933 seconds with 16 queries