Jump to content

floating problems


alexozuna

Recommended Posts

ok i've created these two tables one is set to float to the left and the other is set to float right and everything works but my second table won't float right it just appears under my first table here's the CSS im using in the page i don't think anything interferes with anything else but i could be wrongdiv.banner {background-color:#000000;text-align:center}body {background-color:#ff0033}.h1 {color:#6666ff;text-align:center;font-size:275%}div.navi {float:left;width:15%}div.main {width:85%}.font {color:#3300cc;font-size:150%}.tablegh1 {width:380px;float:left;text-align:left;padding:5px}.tablegh2 {width:380px;text-align:left;float:right;padding:5px}table.gh1 {width:100%;background-color:#ffff00}table.gh2 {width:100%;background-color:#ffcc00}div.text {text-align:center}if you any suggestions please helpalso this is my first post so i ahve no idea hoe this thing is supposed to look so im open to suggestion but plz don't bash me for my stupid mistakes

Link to comment
Share on other sites

What does your HTML look like?Also, try clear:none; on both tables.

Link to comment
Share on other sites

What does your HTML look like?Also, try clear:none; on both tables.
the clear:none didn't make a differenceand the other both tables appear int he HTML filehere's what my HTML and the CSS look like together <html><head><title>Songlists 2</title><style type="text/css">div.banner {background-color:#000000;text-align:center}body {background-color:#ff0033}.h1 {color:#6666ff;text-align:center;font-size:275%}div.navi {float:left;width:15%}div.main {width:85%}.font {color:#3300cc;font-size:150%}.tablegh1 {width:380px;float:left;text-align:left;clear:none;padding:5px}.tablegh2 {width:380px;text-align:left;float:right;clear:none;padding:5px}table.gh1 {width:100%;background-color:#ffff00}table.gh2 {width:100%;background-color:#ffcc00}div.text {text-align:center}</style></head><body><div class="banner"><img src="guitarhero80s.jpg" /></div><div class="h1">Setlist</div><div class="navi"><a href=index.html>Home</a><br /><a href=Games.html>The Games</a><br /><a href=songlist.html>Setlists</a><br />Setlists cont.<br /><a href=companies.html>Companies</a></div><div class="tablegh1"><div class="font">Guitar Hero 80's</div><br /><table border="1" cols="2" rows="30" class="gh1"><tr><th>Song</th><th>Original Band</th>here is where the rest of my first table goes</table><div class="tablegh2"><div class="font">Guitar Hero 3</div></ br><table border="1" cols="2" rows="30" class="gh2"><tr><th>Song</th><th>Original Band</th></tr></table></body></html>
Link to comment
Share on other sites

Instead of doing width:380px on your tables, try a percent under 50%. Or you can change your div.main width to something fixed that is above 760 px. It might be that you're tables are too wide to fix on one line. If you change your div.main to fixed, I suggest changing your div.navi to something fixed as well.Also, use code and /code (incased in brackets) around short bits of code and codebox and /codebox (incased in brackets) around long bits of code.

Link to comment
Share on other sites

Your missing a few </div> tags. Also, I don't see how two tables of 100% width can fit horizontally next to each other...

Link to comment
Share on other sites

Your missing a few </div> tags. Also, I don't see how two tables of 100% width can fit horizontally next to each other...
The tables are embedded in divs that are restricted to 380px if you didn't notice.
Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...