Click to See Complete Forum and Search --> : Text Link and Image formatting issues


metallifan15
09-04-2007, 09:42 AM
Hi!

I have a problem that I would greatly appreciate some help with. I am in the process of developing a web-course. Due to company policy I have to have a footer on the bottom of every page. I am including the code for the footer as a reference. Usually we code it by a server side file include line and it should appear as formatted in the file, like this:
http://www.dragons-lair-designs.com/Images/pagefooter.JPG

But instead it looks like this:
http://www.dragons-lair-designs.com/Images/incorrect_footer.JPG

My code for the footer looks like this:

<div align="center" class="footer"><a name="footer"></a><a href="http://vaww.va.gov/" target="_blank" onclick="DisclaimerInt();" onkeypress="DisclaimerInt();">DVA
Home Page</a><img src="images/footer_linkDivider.gif" alt="Graphic: Link Divider" width="15" height="14" align="bottom"><a href="http://www.firstgov.gov" target="_blank" onclick="DisclaimerInt();" onkeypress="DisclaimerInt();">First
Gov </a><img src="images/footer_linkDivider.gif" alt="Graphic: Link Divider" width="15" height="14" align="bottom"><a href="http://vaww1.va.gov/accessible/" target="_blank" onclick="DisclaimerInt();" onkeypress="DisclaimerInt();">Accessibility
Notice </a><img src="images/footer_linkDivider.gif" alt="Graphic: Link Divider" width="14" height="14" align="bottom"><a href="http://www.va.gov/disclaim.htm" target="_blank" onclick="DisclaimerInt();" onkeypress="DisclaimerInt();">Disclaimer</a><img src="images/footer_linkDivider.gif" alt="Graphic: Link Divider" width="14" height="14" align="bottom"><a href="http://www.va.gov/foia/" target="_blank" title="Freedom of Information Act">FoIA</a><img src="images/footer_linkDivider.gif" alt="Graphic: Link Divider" width="14" height="14" align="bottom"><a href="http://www.regulations.gov" target="_blank" onclick="DisclaimerInt();" onkeypress="DisclaimerInt();">Regulations</a><br>
<a href="http://www.va.gov/orm/NOFEAR-Select.asp" target="_blank" onclick="DisclaimerInt();" onkeypress="DisclaimerInt();">No Fear</a><img src="images/footer_linkDivider.gif" alt="Graphic: Link Divider" width="14" height="14" align="bottom"><a href="http://vaww.va.gov/privacy/" target="_blank" onclick="DisclaimerInt();" onkeypress="DisclaimerInt();">Intranet Privacy Policy</a><img src="images/footer_linkDivider.gif" alt="Graphic: Link Divider" width="14" height="14" align="bottom"><a href="http://www.va.gov/vaforms" target="_blank" onclick="DisclaimerInt();" onkeypress="DisclaimerInt();">Forms and Publications</a><img src="images/footer_linkDivider.gif" alt="Graphic: Link Divider" width="14" height="14" align="bottom"><a href="#footer" onclick="javascript:PopUp('warningnotice.asp','POPUP','scrollbars=yes,resizable=auto,width=770,height=475')">Warning Notice</a><img src="images/footer_linkDivider.gif" alt="Graphic: Link Divider" width="14" height="14" align="bottom"><a href="#footer" onclick="javascript:PopUp('sitemap.asp','POPUP','scrollbars=yes,resizable=auto,width=770,height=475')">Site Map</a><img src="images/footer_linkDivider.gif" alt="Graphic: Link Divider" width="14" height="14" align="bottom"><a href="#footer" onclick="javascript:PopUp('contactus.asp','POPUP','scrollbars=yes,resizable=auto,width=770,height=475')">Contact Us</a></div>

Is there some formatting in Dreamweaver which will not allow text links to have graphic dividers on the same line as text links?

Any Help you can be is appreciated as always!
~metallifan15

Centauri
09-04-2007, 11:21 AM
Both the <a> and <img> elements are inline by default, so there must be some css somewhere else setting either of these to block display. You can target the footer elements by .footer a, .footer img { display: inline;}

Really, that should be marked up as an unordered list of links, with the dividers being side borders on the <li> elements - would save graphics and make more sense semantically.....

metallifan15
09-04-2007, 11:30 AM
I wish it was that simple Centauri. However, all our pages have very strict formatting in the CSS used to format text and hyperlinks. I'll include the CSS code so that can hopefully help.

.Footer a:link {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8pt;
color: #990000;
text-decoration: none;
}
.Footer a:visited {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8pt;
color: #990000;
text-decoration: none;
}
.Footer a:hover {

font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8pt;
color: #993300;
text-decoration: underline;
}
.Footer a:active {

font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8pt;
color: #999900;
text-decoration: underline;
}

Centauri
09-04-2007, 11:44 AM
There is nothing in the css you posted that would cause this display - it can only be from other css not being specific enough so that it is accidentally affecting the footer display as well. You can't add the css snipped I posted before?