Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > how can i get vertical align?

Reply
Thread Tools

how can i get vertical align?

 
 
Giorgio
Guest
Posts: n/a
 
      06-18-2005
Hi,
I use this code to extend <A> area to all the black cell, but i can't center
the links vertically.
Can you help me, please?

Thanks

<HTML>
<HEAD>
<TITLE></TITLE>

<style type="text/css">
<!--
td a {
display:block;
width:40px;
height: 40px;
background-color:#000000;
vertical-align: middle;
color: #ffffff;
text-align:center;
text-decoration:none;
font-family:verdana;
font-weight:bold;
}
td a:hover {
background: #80ff40;
color: #000000;
}
-->
</style>
</HEAD>
<BODY>
<TABLE>
<TR>
<TD><A href="#">1</A></TD><TD><A href="#">2</A></TD><TD><A
href="#">3</A></TD>
</TR>
</TABLE>
</BODY></HTML>


 
Reply With Quote
 
 
 
 
Jonathan N. Little
Guest
Posts: n/a
 
      06-18-2005
Giorgio wrote:

> Hi,
> I use this code to extend <A> area to all the black cell, but i can't center
> the links vertically.
> Can you help me, please?
>
> Thanks
>

<snip code>

the LINKS are vertically aligned within the table cells, see for
yourself by adding a border to the links:


td a {
display:block;
width:40px;
height: 40px;
line-height: 40px;
background-color:#000000;
vertical-align: middle;
color: #ffffff;
text-align:center;
text-decoration:none;
font-family:verdana;
font-weight:bold;
border: 1px solid red; /* add this */
}

now try this and see what one of your problems are...

td a {
display:block;
width:40px;
/* disable this 'height: 40px;' */
line-height: 40px; /* add this */
background-color:#000000;
vertical-align: middle;
color: #ffffff;
text-align:center;
text-decoration:none;
font-family:verdana;
font-weight:bold;
border: 1px solid red; /* add this */
}




--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
 
Reply With Quote
 
 
 
 
Giorgio
Guest
Posts: n/a
 
      06-20-2005
Thanks, it works.
Why is border larger in 2 sides (up and left)?


 
Reply With Quote
 
Giorgio
Guest
Posts: n/a
 
      06-20-2005
sorry, bottom and left
it's weird cause if i stamp screen and zoom it, i can see that the border is
1 pixel everywhere but if i look it without zoom it seems that is larger in
the bottom and in the left side.


 
Reply With Quote
 
Jonathan N. Little
Guest
Posts: n/a
 
      06-20-2005
Giorgio wrote:

> sorry, bottom and left
> it's weird cause if i stamp screen and zoom it, i can see that the border is
> 1 pixel everywhere but if i look it without zoom it seems that is larger in
> the bottom and in the left side.
>
>


Sounds like a video driver/monitor issue or possibly your browser's
rendering engine...

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
 
Reply With Quote
 
 
 
Reply

Thread Tools

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

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Can't get the vertical-align:top to work tshad HTML 9 07-27-2006 03:32 PM
How to get rid of horizontal and vertical lines in DataGrid zhivago ASP .Net Datagrid Control 1 03-20-2006 03:42 PM
can a table align vertical-center on the web form Rabbit ASP .Net 1 02-12-2006 03:09 AM
Can the DIV tag be STYLEd with only a vertical scroll bar? Guy HTML 1 12-13-2003 04:48 AM



Advertisments