Help with h1 tag |
Help with h1 tag |
newbie_css104 |
Jan 13 2017, 08:52 PM
Post
#1
|
Group: Members Posts: 2 Joined: 13-January 17 Member No.: 26,263 |
Hello,
I have tried all I could find on google and now posting here for help. I am using bootstrap.css with a website and then defining my own custom.css, where I am trying the following definition of h1 (to override the original in bootstrap.css). h1 { color:#ff0000; font-weight: bold; margin:0; padding-top:0; margin-top:0; padding:0; display:inline; font-size:inherit; border-style:none; white-space: nowrap; overflow:hidden; } I want to specify part of the page text as <h1> without any space before or after the tag. The above gives me no space after the tag but I can't seem to get rid of the space before the tag. The extra space (equal to 2 line breaks) appears only in case of the first <h1> tag. Subsequent <h1> tags within the same html page have no space around them, before or after. I am stumped as to why this is... Help please? I tried defining new classes, ids, specifying !important, etc... ending up at the same place everytime: the margin/padding/space before the first <h1> tag... Thank you, newbie |
pandy |
Jan 14 2017, 03:09 AM
Post
#2
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
Can you link to the page, please?
|
newbie_css104 |
Jan 16 2017, 03:12 PM
Post
#3
|
Group: Members Posts: 2 Joined: 13-January 17 Member No.: 26,263 |
Pandy, due to security concerns, i can't link to the page here. Is there anything else I can provide...?
Below is the original h1 definition in Bootstrap.css, that I do not wish to modify: h1 { margin: .67em 0; font-size: 2em; } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: inherit; font-weight: 500; line-height: 1.1; color: inherit; } h1 small, h2 small, h3 small, h4 small, h5 small, h6 small, .h1 small, .h2 small, .h3 small, .h4 small, .h5 small, .h6 small, h1 .small, h2 .small, h3 .small, h4 .small, h5 .small, h6 .small, .h1 .small, .h2 .small, .h3 .small, .h4 .small, .h5 .small, .h6 .small { font-weight: normal; line-height: 1; color: #777; } h1, .h1, h2, .h2, h3, .h3 { margin-top: 20px; margin-bottom: 10px; } h1 small, .h1 small, h2 small, .h2 small, h3 small, .h3 small, h1 .small, .h1 .small, h2 .small, .h2 .small, h3 .small, .h3 .small { font-size: 65%; } h4, .h4, h5, .h5, h6, .h6 { margin-top: 10px; margin-bottom: 10px; } h4 small, .h4 small, h5 small, .h5 small, h6 small, .h6 small, h4 .small, .h4 .small, h5 .small, .h5 .small, h6 .small, .h6 .small { font-size: 75%; } h1, .h1 { font-size: 36px; } h2, .h2 { font-size: 30px; } h3, .h3 { font-size: 24px; } h4, .h4 { font-size: 18px; } h5, .h5 { font-size: 14px; } h6, .h6 { font-size: 12px; } .jumbotron h1, .jumbotron .h1 { color: inherit; } Thank you, newbie |
Darin McGrew |
Jan 16 2017, 03:41 PM
Post
#4
|
WDG Member Group: Root Admin Posts: 8,365 Joined: 4-August 06 From: Mountain View, CA Member No.: 3 |
QUOTE I want to specify part of the page text as <h1> without any space before or after the tag. The above gives me no space after the tag but I can't seem to get rid of the space before the tag. The extra space (equal to 2 line breaks) appears only in case of the first <h1> tag. Subsequent <h1> tags within the same html page have no space around them, before or after. I am stumped as to why this is... Help please? Without seeing the actual page, my guess is that it isn't the margin of the H1 element at all. My guess is that it's the margin or padding of an element that contains the H1 element.But that's just a guess, given that I can't see the actual page in question. The following may be helpful: https://css-tricks.com/what-you-should-know...apsing-margins/ |
pandy |
Jan 16 2017, 04:07 PM
Post
#5
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
Or the margin of an element before or after the H1.
|
Lo-Fi Version | Time is now: 16th April 2024 - 11:59 AM |