Benjamins
Members
-
Joined
-
Last visited
-
Hi all, I'm creating my first website. Between the the lilac part and the white box (div) is a line 1px, had the colour of the blue background. I tried a lot but it doesn't disappear. I attached a screenshot. How can I make the white part being next to the lilac part without any border between? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=windows-1250"> <meta name="generator" content="PSPad editor, www.pspad.com"> <title>YIDI CSS</title> <style type="text/css"> <!-- body {background-color:#6666FF; font-family:verdana; font-size:75%;} table.pictures {border-collapse:collapse; width:55em; background: #f5f5f5;} table.infoandmap {border-collapse:collapse; width:55em; background: #f5f5f5; border: 1px solid #c69; margin-top:1em;} table.lilac {border-collapse:collapse;} table.information {} div.whitebox {text-align:left; background-color:#f5f5f5; padding:1em; width:80em;} div.lilac {text-align:buttom; background-color:#5D0866; padding:1em; width:87em; height:5em;} td.pictures {width:10em; height:5em; text-align:center; border: 1px solid #c69;} td.map {text-align:right; padding-right:1em;} td.information {vertical-align:text-top;} td.country {width: 10em; height: 5em; text-align: left; vertical-align: text-top; border: 1px solid #c69;} td.hidden {border: 1px solid #f5f5f5; border-right-color:#c69; border-left-color:#c69;} td.lilac {text-align:right; padding:1em; background-color:#5D0866; width:7em; height:auto;} td img {width:9em; height:4em;} --> </style> </head> <body> <div class="lilac"></div> <table class="lilac"> <tr> <td class="lilac"></td> <td> <div class="whitebox"> <table class="pictures"> <tr> <td class="country"> <b>COUNTRY</b> </td> <td class="hidden"> </td> <td class="pictures"> <img src="path" alt="PICTURE 1" /> </td> <td class="pictures"> <img src="path" alt="PICTURE 2" /> </td> <td class="pictures"> <img src="path" alt="PICTURE 3" /> </td> <td class="pictures"> <img src="path" alt="FLAG" /> </td> </tr> </table> <table class="infoandmap"> <tr> <td class="information"> <!--TABLE with country information--> <table class="information"> <tr> <td><b>Capital:</b></td> <!--Capital:--> <td>Santiago</td> </tr> <tr> <td><b>Continent:</b></td> <!--Continent:--> <td>South America</td> </tr> <tr> <td><b>Currency:</b></td> <!--Currency:--> <td>Chilean Peso</td> </tr> </table> <!--end of TABLE with country information--> </td> <td class="map"> <!--MAP--> <img style="width:auto; height:auto;" src="C:\Documents and Settings\y9098kc4\My Documents\My Pictures\Mood-Swings.jpg" alt="MAP" /> </td> </tr> </table> </div> <td> </tr> </table> </body> </html>
-
Hi all, I'm a beginner with XHTML, creating my very first website, so please forgive me if this should be a stupid question: I crated a table with 6 colums. Each column has a border. I'd like to set the 1st column on the left side, and the other 5 columns without a space between them on the right side. But there is still space between them. What am I doing wrong?? By the way - the 5 colums on the right side contain pictures. They are supposed to be in the middle with the same distance around to the border - doesn't work either ... the picture stucks at the top - but at least horizontally in the middle ... <TABLE style="cellpadding:0; cellspacing:0; width:85em;"> <TR> <TD> <DIV style="float:left; background-color:#f5f5f5; border:1px solid #CC6699; width:10em; height:5em; text-align:left;"> <B>text</B> </DIV> </TD> <TD> <DIV style="float:right; border:1px solid #CC6699; width:10em; height:5em; text-align:center; vertical-align:middle; display:table-cell;"> <IMG style="align:center; width:9em; height:4em;" src="path" alt="PICTURE"> </DIV> </TD> <TD> <DIV style="float:right; border:1px solid #CC6699; width:10em; height:5em; text-align:center; vertical-align:middle; display:table-cell;"> <IMG style="align:center; width:9em; height:4em;" src="path" alt="PICTURE"> </DIV> </TD> <TD> <DIV style="float:right; border:1px solid #CC6699; width:10em; height:5em; text-align:center; vertical-align:middle; display:table-cell;"> <IMG style="align:center; width:9em; height:4em;" src="path" alt="PICTURE"> </DIV> </TD> <TD> <DIV style="float:right; border:1px solid #CC6699; width:10em; height:5em; text-align:center; vertical-align:middle; display:table-cell;"> <IMG style="align:center; width:9em; height:4em;" src="path" alt="PICTURE"> </DIV> </TD> <TD> <DIV style="float:right; border:1px solid #CC6699; width:10em; height:5em; text-align:center; vertical-align:middle; display:table-cell;"> <IMG style="align:center; width:9em; height:4em;" src="path" alt="PICTURE"> </DIV> </TD> <TD> <DIV style="float:right; border:1px solid #CC6699; width:10em; height:5em; text-align:center; vertical-align:middle; display:table-cell;"> <IMG style="align:center; width:9em; height:4em;" src="path" alt="PICTURE"> </DIV> </TD> </TR> </TABLE>