I somehow succeed to put 2 tables in one row, but when I started to write text which must be under the tables it somehow go between the tables. What to do to prevent that. Can you give me some code?
Look how it look like:
Thanks in advance!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <head> <link rel="shortcut icon" href="favicon2.ico"> <style type="text/css"> html, body { background-color:#48d1cc; text-align: justify; scrollbar-arrow-color:black; scrollbar-track-color:#99ffff; scrollbar-shadow-color:black; scrollbar-face-color:#48d1cc; scrollbar-highlight-color:white; scrollbar-darkshadow-color:black; scrollbar-3dlight-color:black; } p { font-family: Arial;color:black; font-size:18px;font-weight: bold;margin:0; } .razmak2 { margin-top:20px; } table.goca3 { font-family: Arial; font-size:17px; color:black; border-width: 2px; border-color: white; border-style: solid; width:515px; margin:auto; margin-top:20px; margin-bottom:40px; font-weight: bold; margin-right: 120px; } table.goca3 th { border-width: 1px; padding: 3px; border-style: solid; border-color: white; background-color: #48d1cc; font-style:italic; font-family: Arial;; font-size:17px; color:firebrick;text-align:center; } table.goca3 td { border-width: 1px; padding: 3px; border-style: solid; border-color:white; background-color: #48d1cc; text-align:left;font-size:17px;color:black;font-weight:bold; } table.goca2 { font-family: Arial; font-size:17px; color:black; border-width: 2px; border-color: white; border-style: solid; width:400px; margin:auto; margin-top:20px; margin-bottom:40px; font-weight: bold; margin-left: 120px; } table.goca2 th { border-width: 1px; padding: 3px; border-style: solid; border-color: white; background-color: #48d1cc; font-style:italic; font-family: Arial;; font-size:17px; color:firebrick;text-align:center; } table.goca2 td { border-width: 1px; padding: 3px; border-style: solid; border-color:white; background-color: #48d1cc; text-align:left;font-size:17px;color:black;font-weight:bold; } </style> <title>Horarna astrologija - Pronadjite izgubljenu stvar ili osobu!</title> <meta name="description" content="horarna astrologija, pronadjite izgubljenu stvar ili osobe..."> <meta name="keywords" content="horarna, astrologija, znak, vrh, kuca, vatreni znaci,kuce horoskopa, zemljani znaci, vodeni znaci, vazdusni znaci, boja, strana sveta, stvar, mesec, venera, sunce, merkur, uran, pluton..."> </head> <body> <table class="goca2" align="left"> <tr> <td style=' width: 100px'><p>mars</p></td> <td><p>crvena, crna, lila</p></td></tr> <tr> <td style=' width: 100px'> <p>venera</p></td> <td> <p>zelena, braon, zuta, roze, bela, plava, narandzasta, bez</p></td></tr> <tr> <td style=' width: 100px'> <p>Merkur</p></td> <td> <p>narandzasto, lila, zuto, plavo, kombinacija dve boje, zeleno</p></td></tr> </table> <table class="goca3" align="right"> <tr> <td style=' width: 100px'><p>Ovan</p></td> <td><p>crvena, crna, lila</p></td></tr> <tr> <td style=' width: 100px'> <p>Bik</p></td> <td> <p>zelena, braon, zuta, roze, bela, plava, narandzasta, bez</p></td></tr> <tr> <td style=' width: 100px'> <p>Blizanci</p></td> <td> <p>narandzasto, lila, zuto, plavo, kombinacija dve boje, zeleno</p></td></tr> </table> <h3 class="razmak2"><span style="color: firebrick;">Drugo mesto gde treba traziti izgubljenu stvar je znak i kuca u kojoj se nalazi Tacka Fortune.</span></h3><p> Za poziciju Tacke Fortune <span style="color: firebrick;font-style: italic;">ne vazi</span> sistem derivatnih kuca! Znaci ako postavimo pitanje u vezi neke stvari koju su sin ili cerka izgubili (znaci u vezi 6.kuce karte) i Tacku fortune nadjemo u 7. kuci gledamo objasnjenja za znak i 7. kucu.</p> </body></html>
Lose the transitional xhtml
Lose the transitional xhtml DTD replace with a generic Standards DTD.
Lose deprecated element attributes such as align - all presentational styling belongs to CSS and must not be applied via atts this has been the case for quite a while.
Float the tables left and right.
Add clear:both to the h3 elements .razmak2
Align attribute
The align attribute (long deprecated and should not be used) is effectively the same as the css property float. So, your page is doing exactly what you told it to do.
You may 'fix' the problem by adding {clear: both;} to the h3 ruleset.
cheers,
gary
We have to fix the acoustics
We have to fix the acoustics in this forum, there's a distinct echo.
Dear gary.turner, THANK YOU
Dear gary.turner, THANK YOU SO MUCH FOR YOUR POST! IT RESOLVED MY PROBLEM.
I appologize, I did not post ruleset for h3.
Also thanks for others posts I will keep in mind all that you said.