Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Other Opera.com home page single red line effect Reply To: Opera.com home page single red line effect

#193509
drone4four
Participant

I’m back with a new pen. I tried the header contents and css rules suggested by bochristensen and Shikkediel . It worked with the original pen I brought up, but I have since tried it with some other of web pages I been working on with varying success. Behold my latest test case:

http://codepen.io/Angeles4four/pen/pvPvOE

Note lines 1 through 5 in the css. Those are the lines I lifted from bochristensen and Shikkediel’s advice. I commented out * { margin:0 } because that casts a margin property of 0 across every single element – – which is not what I am trying to do. Commented out, I’m still not getting the effect I have set out to create.

I see that my existing header is already styled heavily, so I tried using an .ns–nf sub class rule in my css and created a modified header tag in my html file (as was sort of suggested). I figure I’m confusing the two headers.

I’m trying to get a red line at the very top spanning the width of the webpage, not just over the top of my initial header heading. The suggestions already made worked for a basic test case, but now that I am using quite a bit more variables and it’s harder to keep my initial ‘School for the Gifted’ header while adding another one with different variables specified by a class.