StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
primarykey
Id
18918364
data
AcceptedAnswerId
0
AnswerCount
0
ClosedDate
CommentCount
1
CommunityOwnedDate
CreationDate
2013-09-20T13:44:45.210
FavoriteCount
0
LastActivityDate
2013-09-20T13:52:05.187
LastEditDate
2013-09-20T13:52:05.187
LastEditorUserId
944301
OwnerUserId
944301
ParentId
18917317
PostTypeId
2
Score
0
ViewCount
0
LastEditorDisplayName
text
Body
Hm, I feel dirty looking at your code. If your problem is that space on the right side of the container then let me explain what's going on. The reason that space is there is because the 6th element is too wide to stay on the same "row", and it gets pushed down to the next row. The reason it's too wide is because of the combined use of %-width and padding in your css, which never ends well. Illustration <img src="https://i.stack.imgur.com/dSkhX.png" alt="demonstration"> I've constructed an example of how I think you want it to look. I also cleaned your code a little ;) <hr> <h2><a href="http://jsfiddle.net/BvCqc/" rel="nofollow noreferrer">Example</a> | Code</h2> In this example I use absolute values instead of percentages. The benefit from this is that I can calculate the exact width required for my container. A link's width is the sum of the width + padding + margin + border: <pre><code>40 + (5*2) + (2*2) + (1*2) = 56 px </code></pre> And we want 5 links per "row" <pre><code>56 * 5 = 280 px </code></pre> So the container's width has to be at least 280px to fit 5 links per row. <ul> <li>CSS</li> </ul> <pre class="lang-css prettyprint-override"><code>.hournum{ text-decoration: none; color: black; width: 40px; float: left; padding: 0px 5px; text-align: center; color: red; border-radius: 3px; border: 1px solid black; margin: 2px 2px; } .container{ position: absolute; top: 10px; left: 10px; width: 280px; background-color: white; border: 1px solid #6699FF; padding: 2px; } </code></pre> <ul> <li>Javascript</li> </ul> <pre><code>var str = ""; for(var i=1 ; i<=12; i++){ var cc = i; var row if(i <= 9) cc = "0" + i str += '<a href="#" id="time_'+cc+'" class="hournum">'+cc+"</a>"; } document.body.innerHTML = '<div class="container">'+str+"</div>"; </code></pre> Result <img src="https://i.stack.imgur.com/QGGed.png" alt="result">
Tags
Title
singulars
PostAcceptedAnswerId
1. This table or related slice is empty.
PostParentId
1. POHow to solve this? []
 singulars
 PostTypePostTypeId
 PTQuestion
PostTypePostTypeId
1. PTAnswer
UserLastEditorUserId
1. USShadowScripter
UserOwnerUserId
1. USShadowScripter
plurals
PostLinksPostIdRelatedPostId
1. This table or related slice is empty.
PostLinksRelatedPostIdPostId
1. This table or related slice is empty.
PostsAcceptedAnswerId
1. POHow to solve this? []
 singulars
 PostTypePostTypeId
 PTQuestion
PostsParentIdCreationDate
1. This table or related slice is empty.
VotesPostIdCreationDate
1. VO
 singulars
 PostPostId
 PO
 UserUserId
 This table or related slice is empty.
 VoteTypeVoteTypeId
 VTAcceptedByOriginator
CommentsPostId
1. COthanks ShadowScripter.it's working.i have use only hournum code part.and it's work corretly
 singulars
 PostPostId
 PO
 UserUserId
 USproxyserver

Querying!

Guidance

A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.