How to Remove the Top Margin in a Web Page

How do I remove the top margin in a web page?

I had similar problem, got this resolved by the following CSS:

body {    
margin: 0 !important;
padding: 0 !important;
}

How to remove the margin at the top of my page

Set margin: 0; to <h1> element

Demo: http://jsfiddle.net/5w6Es/

Same problem as with the margin-left of <ul> elements, or margin-top / margin-bottom of <p> elements, etc.

You need to reset their default styles when using them at the borders of your page.

Removing body margin in CSS

I would say that using:

* {
margin: 0;
padding: 0;
}

is a bad way of solving this.

The reason for the h1 margin popping out of the parent is that the parent does not have a padding.

If you add a padding to the parent element of the h1, the margin will be inside the parent.

Resetting all paddings and margins to 0 can cause a lot of side effects. Then it's better to remove margin-top for this specific headline.

How to remove top margin from a website with nested containers?

Paragraphs have a default margin. Eliminate it:

p {
margin:0;
}

jsFiddle example

HTML/CSS - Remove top and side margins

add margin:0 to the body tag

body { 
background-color: #00FFFF;
font-family: Verdana, Tahoma, sans-serif;
margin:0;
}

How to remove margin space around body or clear default css styles

body has by default 8px margins: http://www.w3.org/TR/CSS2/sample.html

body { 
margin: 0; /* Remove body margins */
}

Or you could use this useful Global reset

*,
*::before,
*::after {
margin: 0;
padding: 0;
box-sizing: border-box;
}

If you want something less * global:

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}

some other CSS Reset:

http://meyerweb.com/eric/tools/css/reset/

https://github.com/necolas/normalize.css/

http://html5doctor.com/html-5-reset-stylesheet/

Removing 10px of margin at top of HTML pages

The H1 tag has a standard margin of 10px which causes this. Try a reset:

*,html,body {
margin:0;
padding:0;
}

The "*" character is a global selector.



Related Topics



Leave a reply



Submit