/    Sign up×
Community /Pin to ProfileBookmark

Tables side by side on a web page.

My question.

Table t1,t2,t3 and t4 have same width.

They all have two columns which divide the table even. The cell width should be fixed.
I want t1 to be float on the left, the rest of tables floating on the right from the top down.

And between t2,t3,t3, I want to put some sentences.

Thanks for help.
Now the sentence between t2 and t2 goes to the top.
Could you please look at my code?

[CODE]<html xmlns=”http://www.w3.org/1999/xhtml” >
<head>
<style type=”text/css”>
table {
border-collapse: collapse;
}
.right
{
float:right;
}

#contents {width:900px;}
#contents table {table-layout: fixed;width:380px;}
#table_one {float:left;}
td {width: 190px; }

</style>
</head>
<body style=”background-color: #FFFFCC”>
<form id=”form1″ runat=”server”>
<div>
<p>
Test
</p>
<p>
Something
</p>
<br/>
<br/>
</div>
<p>
Another thing
</p>
<div id=”contents”>

<table id=”table_one”>
<tr>
<td>12 Apostles</td>
<td>12 aaa</td>
</tr>
</table>

<table class=”right” id=”table_two”>
<tr>
<td>table two cell</td>
<td> </td>
</tr>
</table>

<p>
Sentence 1
</p>

<table class=”right” id=”table_three”>
<tr>
<td>table three cell</td>
<td> </td>
</tr>
</table>
</div>
</form>
</body>
</html>

[/CODE]

Thanks

to post a comment
HTML

3 Comments(s)

Copy linkTweet thisAlerts:
@PprakashApr 28.2010 — .right


{


float:right;


}

change this as below

.right


{


display:inline;

vertical-align:middle;

}

really it works. try without douts, if u fail please ask once again
Copy linkTweet thisAlerts:
@zhshqzycauthorApr 28.2010 — But, it is not right.:mad:

The right tables are adjacent the left one immediately. I want they are seperated by blank spaces.

Also the sentence between t2 and t3 goes to the right.:eek:
Copy linkTweet thisAlerts:
@PprakashApr 29.2010 — try the properyt like text-align:right; for the text between tables
×

Success!

Help @zhshqzyc spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.17,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...