Re: [css-d] Site Check - Footer Problem
Hi, I've only looked at it in Firefox. I notice you've a div id= containerwrapper *and* a div id=container maybe if you put your #footercontainer within the #containerwrapper it would simplify things for you? Just a thought. T. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Firefox behaviour - Child element margins applied to parent elements instead
Hi All,
I hope this isn't something that's come up before. Seeing as it's not in the
lists of usual bugs in browsers, I'm guessing it might be my ignorance
rather than a poorly implemented recommendation. I hope someone can
enlighten me as it's something that's repeatedly come up and I've never
found a way around it other than the one I'll outline which isn't what I
want at all...
I've built a proof of concept. See link below
http://www.tonyhaddon.com/cssbug/test.html
Markup here is
-
?xml version=1.0 encoding=utf-8?
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN
http://www.w3.org/TR/2000/REC-xhtml1-2126/DTD/xhtml1-strict.dtd
html xmlns=http://www.w3.org/1999/xhtml; xml:lang=en lang=en
head
meta http-equiv=content-type content=text/html; charset=utf-8 /
style type=text/css media=screen
@import url('includes/cssbug.css');
/style
titleTest Page/title
/head
body
div id=outer
div id=inner
h1Header/h1
/div
/div
/body
/html
-
And my CSS is:
body {
background: #cc;
padding: 0;
margin: 0;
}
#outer {
width: 900px;
background: #ff;
}
#inner {
height: 100px;
/*border: solid 1px;*/
}
h1 {
margin: 50px 0 0 10px;
padding: 0;
background-color: Red;
}
-
My problem lies in the margin I've applied to the h1 element here. It ought
to offset the h1 block from the containing #inner element. In IE6 it works
as planned, but Firefox appears to apply the margin to the element two steps
up the tree e.g. the #outer element.
The only fix I have been able to find is putting a border on the #inner
element (see example at
http://www.tonyhaddon.com/cssbug/test2.html)http://www.tonyhaddon.com/cssbug/test2.html.
This seems to apply the padding in all the right places... but now I have a
border on my #inner that I don't want!
Can anyone make any suggestions?
Thanks in advance
Tony
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Columns with more than one element
Generally I'd wrap each row in a separate div with a clear:both style
assigned to it.
style
div.row {
clear: both
}
/style
div class=row
div id=aa/div
div id=bb/div
/div
div class=row
div id=cc/div
div id=dd/div
/div
Might not be ideal though and I'm sure more experienced CSSers would
have a better suggestion. I'd be keen to a way to avoid the extra markup
myself!
Oops, and I note there's no quotes on your id attributes!
Tony
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] PNG Transparency in IE for background-image
Hi everyone (hope this isn't a little off-topic), i'm totally stumped on this one not really up-to-speed on behaviours... i found the IE fix for png transparency which seems to apply just fine to the img element, but I have no clue about how I can make it work for a background-image. Any ideas? http://webfx.eae.net/dhtml/pngbehavior/pngbehavior.html The link to the original IE fix http://www.tonyhaddon.com/snozone/3_Booking_Activity.html My page under construction with two copies of the same PNG, one in the img element (working) and one set as background-image to the h1 (not working) Any ideas, links to resources etc much appreciated. Regards, Tony -- Tony Haddon -- Tony Haddon +353 (0)86 831 7058 58 Blackberry Rise, Portmarnock, Co. Dublin. [EMAIL PROTECTED] VAT Reg: IE6837435H __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Problem with links as block-level elements
Hi Eric, Thanks for the advice, although I'm not sure I completely understand. I want to get the links sitting side-by-side across the top as is, but the only way I know to do that is to nest divs and float:right hence: div id=1 div id=2 a href=foo.htmlfoo/a a href=fooyootoo.htmlfooyootoo/a!--this is floated right-- /div a href=fooyoothree.htmlfooyoothree/a!--this is floated right-- /div If there's a better way to approach this type of layout, I'd really appreciate hearing about it it seems to me one of the weakest areas of css implementation, but that's probably just out of my own ignorance! Meanwhile, seeing as you had difficulty with getting all the build files for the site, i've zipped them up and placed them here (http://www.easycare.ie/build.zip 68k) if you're willing to test out that theory of yours! Please let me know how you get on and thank you again. Tony __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
