Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add margin right to table [closed]

Tags:

html

css

I have following html:

<table width="100%;>
        <tr><hr style="width:100%;"></hr></tr>
        <tr>
            <span style="float:left">abc</span>
            <span class="noindex" style="float:right">PageID</span>
        </tr>
        <br/>
        <tr>Some text here...</tr>
</table>

I want to add 100px margin from right of the screen. i tried adding margin-right and removing width =100% it is not working.

like image 871
NoviceMe Avatar asked Feb 22 '12 21:02

NoviceMe


People also ask

How do I set the margins on the right side?

The margin-right property in CSS is used to set the right margin of an element. It sets the margin-area on the right side of the element. Negative values are also allowed. The default value of margin-right property is zero.

Why margin-right is not working?

You cannot see the effect of margin-right because the 'width' property of div causes the margin of div to have more than 10px distance from the right wall of the body. Consequently, it causes the margin-right property not to have any visual effect.

How do you add margins to a table in HTML?

Another way of applying some margin on a <tbody> element is to use a ::before or ::after pseudo element. This way we basically add a new (empty) row which we can use to add some space at the beginning of our <tbody> elements.


1 Answers

margin-right will not work if you set width to 100%. What you could do is :

  1. wrap table in a div tag. add margin to div
  2. set table width to 100%

UPDATED If you are creating a page layout, then you should be using divs instead of tables. Tables are appropriate for data display (like custom grid style view).

<div>
    <div style="margin-right:100px">
        <table style="width:100%">
            //your table
        </table>
    </div>
</div>

Hope it helps.

like image 67
Sebastian Siek Avatar answered Sep 24 '22 07:09

Sebastian Siek