-
1. Re: CSS background to multiline heading
Jon Fritz II Oct 11, 2013 8:34 AM (in response to matthew stuart)The background-color is added to a span tag around the text in your example.
How is your page coded?
Could you post a link to it?
-
2. Re: CSS background to multiline heading
matthew stuart Oct 11, 2013 9:17 AM (in response to Jon Fritz II)Here you go:
http://www.showmetransport.com/inc-HomePagePanel.php
It is responsive, so if you collapse the page, you see the effect of the text wrapping and how it suddenly switches from sitting behind the text on a single line to becoming a full width panel on multi lines.
There is already a version in place on the homepage, but although I have tried to make it responsive, the DW extension I used for it is difficult to work with. I actually found the widget spry tabbed panels easier to work with.
-
3. Re: CSS background to multiline heading
Jon Fritz II Oct 11, 2013 10:35 AM (in response to matthew stuart)I'm guessing it might have something to do with the errors in your code.
Right now, you dont have a doctype, or the html, head, title, or body tagsets...
I'm actually kind of surprised this page renders at all to be honest.
-
4. Re: CSS background to multiline heading
matthew stuart Oct 11, 2013 11:00 AM (in response to Jon Fritz II)It was doing the same prior to me removing the doc type etc, but I have removed them as this will be an include in the homepage. If they are there, then the inlclude fails on the page it's actually included in.
I've added the tags now, but you'll see that it's still doing them same.
I've always removed the tagsets from any file that I intend to include in another as otherwise the parent page with the includes fails to render as it hits a </body> and </html> before the whole page is loaded... is that not the right thing to do?
-
5. Re: CSS background to multiline heading
Jon Fritz II Oct 11, 2013 11:18 AM (in response to matthew stuart)Yes, you did it correctly, it's just that to debug a page's html, it's generally best to have the entire page to rule out an html error induced Quirks Mode as the reason for a display problem.
Lemme dig a little bit and see what I can find.
-
6. Re: CSS background to multiline heading
Jon Fritz II Oct 11, 2013 11:34 AM (in response to Jon Fritz II)The float is causing it.
I haven't tested it yet, but you should be able to add a class called just .hppheader to your css and put the float on that instead of on the inner nested <span> defined in your .hppheader span class.
-
7. Re: CSS background to multiline heading
matthew stuart Oct 11, 2013 3:13 PM (in response to Jon Fritz II)Thanks Jon, that worked a treat



