Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 2647
  • Last Modified:

Bottom of font descenders cut off

Hi Experts,

I have font descenders cut off issue on a login page that I am working on.

this is a footer section
<div id="foot">
			<a href="http://www.xxx.org/" rel="external" title="xxx"><img src="./images/xxx.png" alt="xxx" /></a> 
			<ul><li >
			
			<a  href="xxx.org" style="text-decoration: none;" title="Send an Email"><span class ="underline">Contact Us</span></a></li>
			    <li>The Xxxxgxxxx Xxpxxxx Xxxx</li> <!-- *********the letter 'g' and 'p' descenders are cut off ********-->
			    <li>xxxxx</li><li>xxx, xx 77777</li> 
			    <li>777-777-7777</li>
			
			   
			  
			</ul>
			<a href="http://www.xxx.org/" rel="external" title="xxx"><img src="./images/xxx.png" width="200" height="18" alt="xxx" /></a> 
			 
			 
			
			<ul><li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			
			<a href="xxxx.org" style="text-decoration: none;" title="Send an Email"><span class ="underline">Contact Us</span></a></li>
			    <li>xxxxxxxxxx</li>
			    <li>xxxxxxx</li><li>xxxxx, xx 77777</li> 
			    <li>777-777-7777</li><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
			
			  
			</ul>
			 
			 
			
		</div>



//this is from css file.
/* *****************
FOOTER
***************** */

#foot {
	clear: both;
	height: 110px;
	background: url(./css_images/gradient05.png) 0 0;
	z-index: 50;
	overflow: hidden;		
}
#foot img {
	margin: 10px 10px -20px 20px;
}

#foot ul {
	position: relative;
	top: -2px;
	display: block;
	width: 760px;
	height: 10px;/* spacing between KKI address and OIF address*/
	margin-left: 190px;
	font-size: 12px
}

#foot ul  li {
	display: inline;
	margin: 4px;
}

#foot ul  li:first-child {
	margin-left: 0;
}

#foot a {
	color: black
	text-decoration: none;
} 

Open in new window


thanks in advance,
0
dkim18
Asked:
dkim18
  • 2
2 Solutions
 
Andrew DerseIT ManagerCommented:
This is what I see, I am seeing small text with the font descenders fully visible...is it css code elsewhere on the page that is changing this?

3
0
 
dkim18Author Commented:
there are some other css files.


ieFixes.css
#content { overflow-x: hidden } 
#leftcol { margin-top: 10px } 
#leftcol ul, #leftcol ul li { margin-top: 0; }
acronym, abbr {
	border-bottom: 1px dotted #EEE;
	padding-bottom: -1px;
}
#twocol h2:first-child, #twocol ul:first-child, #twocol dl:first-child, #twocol p:first-child { 
	margin-top: 32px;
}
ul#calendar li {
	zoom: 1;
    *display: inline;
}

#twocol dl.bioStyleTwo dd image {
	margin-top: 15px
}

body#research li h3 { display: inline !important }

#content div#header{
	position: relative;
	top: 0px;
	zoom: 1;
	z-index: 100
}

#content {
overflow: visible
}

#content dl.bioStyleOne { clear: both }

Open in new window


form.css
/* ******************************

	REGISTERY FORM
	
***************************** */

form#searchEmail {
	position: relative;
	display: block;
	height: 400px;
	width: 620px;
	background: url(./css_images/formsprite.png) no-repeat 0 0;
}
form#searchEmail legend span {
	position: absolute;
	top: 20px;
	left: 29px;
	display: block;
	width: 230px;
	height: 36px;
	background: url(./css_images/formsprite.png) no-repeat -73px -648px;
}
form#searchEmail input.text {
	display: block;
/*	position: relative;
	top: -14px;
	left: 2px; */
	float: right;
	border: 0;
	padding: 15px 10px 0 10px;
	height: 27px;
	width: 233px;
	background: url(./css_images/formsprite.png) no-repeat -180px -468px;
}
form#searchEmail input.text:focus {
	background: url(./css_images/formsprite.png) no-repeat -180px -414px;
}
form#searchEmail label {
	float: left
}
	
form#searchEmail ol {
	position: absolute;
	width: 434px;
	top: 112px;
	left: 29px;
	list-style: none;
}
form#searchEmail ol li {
	padding: 0;
	margin: 0;
	clear: both;
	height: 42px;
}
li#emaillabel  label {
	height: 42px;
	width: 174px;
	background: url(./css_images/formsprite.png) no-repeat 0 -414px;
}

li#passwordlabel  label {
	height: 42px;
	width: 174px;
	background: url(./css_images/formsprite.png) no-repeat 0 -522px;
}
form#searchEmail button {
	position: absolute;
	top: 106px;
	left: 316px;
	cursor: pointer;
	display: block;
	width: 118px;
	height: 31px;
	border: 0;
	background: url(./css_images/formsprite.png) no-repeat -504px -414px;
}

form#searchEmail button:hover, form#searchEmail button:active {
	display: block;
	width: 118px;
	height: 31px;
	border: 0;
	background: url(./css_images/formsprite.png) no-repeat -504px -468px;
}
form#searchEmail legend span > span, form#searchEmail label span, form#searchEmail h2 span, form#searchEmail button span, h2#moreinfo span {
	position: absolute; left: -1000px; top: -1000px
}

form#searchEmail h2 {
	width: 127px;
	height: 85px;
	background: url(./css_images/formsprite.png) no-repeat -504px -504px;
	position: absolute;
	top: 88px;
	left: 465px
}
form#searchEmail #register {
	text-align: center;
	font-size: 12px;
	font-weight: bold;
	letter-spacing: -1px;
	line-height: 1.8;
	width: 107px;
	position: absolute;
	top: 130px;
	left: 485px
}
form#searchEmail p {
	font-size: 11px;
	text-shadow: white 1px 1px 0px;
	position: absolute;
	top: 70px; 
	left: 29px
}
form#searchEmail #register a:link {
	letter-spacing: 0px;
	color: #ff6817
}

h2#moreinfo {
	position: absolute;
	top: 260px;
	left: 39px;
	display: block;
	width: 230px;
	height: 20px;
	background: url(./css_images/formsprite.png) no-repeat 0 -719px
}

ul#moreinfolinks {
	position: absolute;
	top: 310px;
	left: 39px;
	font-size: 12px;
}
ul#moreinfolinks li a:link {
	color: black
}
#moreinfolinks a:hover, #moreinfolinks a:visited {
color: black;
	text-decoration: none
}
/* *********************
MODAL
******************** */

/* Overlay */
#simplemodal-overlay {background-color:#FFF; cursor:wait;}

/* Container */
#simplemodal-container {
	position: relative;
	height: 400px; 
	width:620px; 
	overflow: hidden;
	line-height: 1.6
}
#simplemodal-container form#searchEmail #register {
	top: 125px;
}
#simplemodal-container form#searchEmail p {
top: 80px
}
#simplemodal-container h2#moreinfo, #simplemodal-container ul#moreinfolinks {
left: 29px
}
#simplemodal-container a.modalCloseImg {
	background: url(./css_images/formsprite.png) no-repeat 0 -648px; 
	width: 45px; 
	height: 45px; 
	display: block; 
	z-index: 3200; 
	position: absolute; 
	top: 20px; 
	right: 24px;
}

.js {
	visibility: hidden
}

Open in new window


print.css
ul.abstract, ul.menu, ul.studyMetaData {
list-style: none;
}
ul.abstract div {
display: block !important;
}

#header, #leftcol , .skiplink{
display: none;
}
a { color: black }

#foot ul {
	list-style: none;
}

h1 {
font-size: 14pt;
}

h2 {
font-size: 12pt;
text-transform: uppercase
}

h3 {
font-size: 12pt;
display: inline;
}

Open in new window


reset.css
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

Open in new window

0
 
GaryCommented:
Remove
line-height: 1;
from reset.css
0
 
dkim18Author Commented:
thanks all....your comments helped to solve my issue.
0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now