HighDots Forums  

Multiple Anchors

Cascading Style Sheets Layout/presentation on the WWW (comp.infosystems.www.authoring.stylesheets)


Discuss Multiple Anchors in the Cascading Style Sheets forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
AT
 
Posts: n/a

Default Multiple Anchors - 07-19-2009 , 06:06 PM






I have a problem with anchor links that are either are in conflict or
have been declared incorrectly. The url

http://midtownmuseumdistrict.org/index13

shows a page that's working as I want - except for the brown "blob" on
the left near the top. It's apparently caused by something in my anchor
declarations and the use in the

<a class="picture" href="javascript:gotoShow()">
<img class="picture" src="005.jpg" name="slide" border=0 width=363
height=272></a>

code lines. I have tried various declarations and options, but to no
avail. Please advise. TIA
(Also, I sense that there are numerous faults and poor design in this
page, and as a relative newbie I'd appreciate any style
recommendations...)

Reply With Quote
  #2  
Old   
BootNic
 
Posts: n/a

Default Re: Multiple Anchors - 07-19-2009 , 09:36 PM






On Sun, 19 Jul 2009 15:06:41 -0700
mrc2323 (AT) cox (DOT) net (Mike Copeland) wrote:

Quote:
I have a problem with anchor links that are either are in
conflict or have been declared incorrectly. The url

http://midtownmuseumdistrict.org/index13

shows a page that's working as I want - except for the brown
"blob" on the left near the top. It's apparently caused by
something in my anchor declarations and the use in the

a class="picture" href="javascript:gotoShow()"> <img
class="picture" src="005.jpg" name="slide" border=0 width=363
height=272></a
The “brown blob” is caused by the padding style you have declared. You
should be able to simply do away with the link as it servers no useful
purpose that I can see.

Just use: <div><img class="picture" src="005.jpg" name="slide"
width="363" height="272"></div>

Quote:
code lines. I have tried various declarations and options, but
to no avail. Please advise. TIA (Also, I sense that there are
numerous faults and poor design in this page, and as a relative
newbie I'd appreciate any style recommendations...)
http://validator.w3.org/

validator.w3.org 4.01 strict => http://tinyurl.com/lwyx4v

Much to go you have. Start by trying to understand and fix the errors
with the above url. Fix what you can understand and ask about the rest.

Even so there is much to improve beyond the errors, but fixing the
errors is a good place to start.

Since the html errors have nothing to do with stylesheets, perhaps a
better place to ask about the html would be alt.html or
comp.infosystems.www.authoring.html



--
BootNic Sun Jul 19, 2009 09:36 pm
"The POP3 server service depends on the SMTP server service, which
failed to start because of the following error: The operation
completed successfully."
*Windows NT Server v3.51*

⁕ 358 days remaining

-----BEGIN PGP SIGNATURE-----
Version: GnuPG v2.0.11 (GNU/Linux)

iEYEARECAAYFAkpjyiUACgkQmo2774GZ7qnergCfZ9SV3LHQpS K/7bBvS0Ko4rYM
xRwAmwR0mEl1KnuZSW2ZfSzDoAxSxwgb
=j73L
-----END PGP SIGNATURE-----

Reply With Quote
  #3  
Old   
John Hosking
 
Posts: n/a

Default Re: Multiple Anchors - 07-19-2009 , 09:52 PM



On Sun, 19 Jul 2009 15:06:41 -0700, Mike Copeland wrote:

Quote:
I have a problem with anchor links that are either are in conflict or
have been declared incorrectly.
Or there's some other, completely different problem.

But if you suspect a bad declaration or some invalid syntax, check it out
yourself (ideally before posting to usenet for help):
http://validator.w3.org/ for markup
http://jigsaw.w3.org/css-validator/ for CSS

You've got 12 markup errors, some of which from haphazard insertion of JS.
Your CSS shows 8 errors, 7 warnings. (Among which, the invention of a new
psedo-selector icture.)

Quote:
The url

http://midtownmuseumdistrict.org/index13

shows a page that's working as I want - except for the brown "blob" on
the left near the top. It's apparently caused by something in my anchor
declarations and the use in the

a class="picture" href="javascript:gotoShow()"
img class="picture" src="005.jpg" name="slide" border=0 width=363
height=272></a

code lines. I have tried various declarations and options, but to no
avail.
Well, beyond the offensively large graphic (and the invalid code), what
exactly is the real problem you want help with? By which I mean, in *what
way* does the brown "blob" not work the way you want? What way do you want
it to work? What are you hoping for?

BTW, if you have an <a> element with class="picture", you probably don't
need to assign the class .picture to an <img> element contained within the
<a>. You can select the img element with .picture img in the CSS.

Quote:
(Also, I sense that there are numerous faults and poor design in this
page, and as a relative newbie I'd appreciate any style
recommendations...)
The page might mention where on the planet the MMDNA is, "Midtown" of what
city?

Your nav bar is marked up as list itels (fine), but the items under
"Purpose" and "Boundaries" are similarly list items, which you've marked up
as sort of lines of a paragraph, but separated with <br>. Use <li> for the
items, label with a h3 heading (or h2, after making your main heading an
h1). The <li> elements can be styled with a left margin so you don't need
series of nbsp entities on each line.

That the association has a purpose, and the purpose is listed on the Web
page, makes sense. But the boundaries listed are geographic, which is weird
for an association, which is usually a group of people.

The nae bar overlaps when it wraps at narrower viewports or with larger
text sizes than you've apparently used while developing.

What's that enormous picture *of*, anyway, now that I've gone to such
efforts to download it? Why is it on the page? Where's the caption? Title
attribute? Alt text? What's it a link to, and why do you link via JS
(assuming it's on) rather than straight HTML?

HTH.

--
John

Reply With Quote
  #4  
Old   
rf
 
Posts: n/a

Default Re: Multiple Anchors - 07-20-2009 , 07:04 AM



Mike Copeland wrote:
Quote:
I have a problem with anchor links that are either are in conflict
or have been declared incorrectly. The url

http://midtownmuseumdistrict.org/index13
Do *NOT* inflict a two megabyte animated gif on me.
Quote:
shows a page that's working as I want - except for the brown "blob" on
the left near the top. It's apparently caused by something in my
anchor declarations and the use in the
Your brown blob is there because you have floated the image contained in
that a element. So, the image is not out to the right and what you are left
with is the remaining content of the a elememt, namely the whitespace with a
background colour of blob brown.

If you want the link on the right then float the a element, not the img.


Quote:
(Also, I sense that there are numerous faults and poor design in
this page, and as a relative newbie I'd appreciate any style
recommendations...)
Don't send me humungous images.

Reply With Quote
  #5  
Old   
AT
 
Posts: n/a

Default Re: Multiple Anchors - 07-20-2009 , 10:41 AM



Quote:
I have a problem with anchor links that are either are in
conflict or have been declared incorrectly. The url
http://midtownmuseumdistrict.org/index13
shows a page that's working as I want - except for the brown
"blob" on the left near the top. It's apparently caused by
something in my anchor declarations and the use in the
a class="picture" href="javascript:gotoShow()"> <img
class="picture" src="005.jpg" name="slide" border=0 width=363
height=272></a>=

The "brown blob" is caused by the padding style you have declared. You
should be able to simply do away with the link as it servers no useful
purpose that I can see.

Just use: <div><img class="picture" src="005.jpg" name="slide"
width="363" height="272"></div
That works, and it solves the problem - thanks!

Reply With Quote
  #6  
Old   
AT
 
Posts: n/a

Default Re: Multiple Anchors - 07-20-2009 , 10:47 AM



Quote:
Well, beyond the offensively large graphic
Fixed...
(and the invalid code), what
exactly is the real problem you want help with? By which I mean, in *what
way* does the brown "blob" not work the way you want? What way do you want
it to work? What are you hoping for?
I don't want the "blob" at all - it just appeared during development,
and I want to remove it.

Quote:
BTW, if you have an <a> element with class="picture", you probably don't
need to assign the class .picture to an <img> element contained within the
a>. You can select the img element with .picture img in the CSS.
Yes, I know that I have much to learn and understand. 8<{{

Quote:
(Also, I sense that there are numerous faults and poor design in this
page, and as a relative newbie I'd appreciate any style
recommendations...)

The page might mention where on the planet the MMDNA is, "Midtown" of what
city?
Phoenix, AZ. I'll talk to my "leaders" and see if they want this
embellishment of if it's implicit in the target audience.

Quote:
Your nav bar is marked up as list itels (fine), but the items under
"Purpose" and "Boundaries" are similarly list items, which you've marked up
as sort of lines of a paragraph, but separated with <br>. Use <li> for the
I'll look into that. Thanks.

Reply With Quote
  #7  
Old   
AT
 
Posts: n/a

Default Re: Multiple Anchors - 07-20-2009 , 10:51 AM



Quote:
http://midtownmuseumdistrict.org/index13

Do *NOT* inflict a two megabyte animated gif on me.
Yes, I've corrected that. Sorry...

Quote:
shows a page that's working as I want - except for the brown "blob" on
the left near the top. It's apparently caused by something in my
anchor declarations and the use in the

Your brown blob is there because you have floated the image contained in
that a element. So, the image is not out to the right and what you are left
with is the remaining content of the a elememt, namely the whitespace with a
background colour of blob brown.

If you want the link on the right then float the a element, not the img.
I don't know how to do that. Please explain.

Quote:
(Also, I sense that there are numerous faults and poor design in
this page, and as a relative newbie I'd appreciate any style
recommendations...)

Don't send me humungous images.
Again, I apologize. 8<{{

Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.