...

View Full Version : Needing suggestions for a problem with rounded corners.



balz2thawal
08-29-2010, 08:53 AM
Hi all,

I am having an issue with making a UL box have rounded corners. I have created 3 separate images using photo shop and when I try putting them together I get a small gap in between each. I feel like I've tried everything but being new to CSS im sure its something obvious I am missing. I'm going to provide everything im working with and would greatly appreciate any suggestions.



<div id="helpfullinks">

<ul>
<p class="first"><a href="http://allaboutclothdiapers.com/" title="All about cloth diapers" target="_blank">All about cloth diapers.</a></p>
<a href="http://allaboutclothdiapers.com/how-many-cloth-diapers-do-you-need/" title="How many diapers do I need?" target="_blank">How many diapers do I need?</a>
<a href="http://mothering.com/green-living/dumping-disposable-diapers" title="Dumping disposable diapers" target="_blank">Dumping disposable diapers.</a>
<a href="http://www.mothering.com/green-living/crazy-for-cloth" title="Crazy for cloth" target="_blank">Crazy for cloth!</a>
<a href="http://www.mothering.com/green-living/joy-of-cloth-diapers" target="_blank">The joy of cloth diapers!</a>
<p class="last"><a href="http://clothdiaperhelp.com/index.php/en/the-news/45-5-ways-to-soothe-a-fussy-baby" title="Soothing your baby." target="_blank">Soothing your baby.</a></p>
</ul>
</div>


I added the first/last class tags to give the pics something to hold on to. They may be the problem but I couldn't figure out how to do it with out them.



#helpfullinks p.first {
background-image:url(../Images/helpfullinkstop.png);
color: #ffffcc;
margin: 0;
background-repeat: no-repeat;
background-position: left top;
}

#helpfullinks p.last {
background-image:url(../Images/helpfullinksbtm.png)
margin: 0;
background-repeat: no-repeat;
background-position: left bottom;
}

#helpfullinks {
padding-right: 10px;
padding-bottom: 0px;
padding-left: 10px;
height: auto;
background-color: #FFFFFF;
}

#helpfullinks ul {
background-image: url(../Images/helpfullinksmid.png);
background-repeat: repeat-y;
}

#helpfullinks a {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
line-height: 1.5em;
text-decoration: none;
display: block;
margin: 5px;
padding: 5px;
}


At this point I'm lost but I don't want to give up yet. Again any help would be greatly appreciated.

effpeetee
08-29-2010, 09:14 AM
Your may find this site of use. (http://www.exitfegs.co.uk/Sources.html)

Right hand column.

Specimen choice here. (http://www.roundedcornr.com/)



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum