Html Posted March 9, 2019 Share Posted March 9, 2019 (edited) <head> <style> body h1 { color: white; } div { border: 2px white; background-color: red; padding-top: 50px; padding-right: 30px; padding-bottom: 50px; padding-left: 80px; } </style> </head> I have used <h1>header text</h1> in the body section. The padding works, but no text on the padding. Aiming for that https://www.w3schools.com/code/tryit.asp?filename=G1W9NUG2JAYH Thank you. Edited March 9, 2019 by Html Added link demo Link to comment Share on other sites More sharing options...
dsonesuk Posted March 9, 2019 Share Posted March 9, 2019 What do you mean by "no text on padding"? Padding forces text away from the elements edge. Link to comment Share on other sites More sharing options...
Html Posted March 9, 2019 Author Share Posted March 9, 2019 What I want is a coloured header, which is in red, and white text on it, so to replace my header image. Link to comment Share on other sites More sharing options...
dsonesuk Posted March 9, 2019 Share Posted March 9, 2019 whaa? Just red header (h1) with white text? then give the header the red background instead. Link to comment Share on other sites More sharing options...
Html Posted March 10, 2019 Author Share Posted March 10, 2019 div { border: 2px white; background-color: red; padding-top: 50px; padding-right: 30px; padding-bottom: 50px; padding-left: 80px; } That is the header in red, that loads, but the text won't load on top in white. Link to comment Share on other sites More sharing options...
dsonesuk Posted March 10, 2019 Share Posted March 10, 2019 Oh right! Where using secret code to hide what we really want and mean, got yeah! Ok! We add color: white; to the FOOTER (nudge nudge wink wink), which makes the text within FOOTER (nudge nudge wink wink) white against the HEADER (nudge nudge wink wink) background. Link to comment Share on other sites More sharing options...
dsonesuk Posted March 10, 2019 Share Posted March 10, 2019 (edited) OR change body h1 { color: white; } Which only targets child h1 element anywhere within the body, to body { color: white; } That makes all text within body wherever it is white. Edited March 10, 2019 by dsonesuk Link to comment Share on other sites More sharing options...
Html Posted March 10, 2019 Author Share Posted March 10, 2019 <style> h1 { color: white; } div { border: 2px white; background-color: red; padding-top: 50px; padding-right: 30px; padding-bottom: 50px; padding-left: 80px; } </style> <center> <div><h1>header</h1></div> </center> Now this works. Link to comment Share on other sites More sharing options...
dsonesuk Posted March 11, 2019 Share Posted March 11, 2019 Tapping side of nose, nudge nudge wink wink, say no more! Your code you originally posted was right after all! or was it? nudge nudge wink wink guv! Even using deprecated center tag OR are you? nudge nudge wink wink. Link to comment Share on other sites More sharing options...
Html Posted March 12, 2019 Author Share Posted March 12, 2019 I wouldn't know. First time I have used CSS since I first had a book on it back in 2006/2007, and then got rid off in 2008 when I gave up on trying to learn some website design. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now