Re: [css-d] CSS positioning question
Try this:
#header {
height: 50px;
margin: 0 auto -19px;
padding: 30px 0 0;
position: relative;
text-align: center;
width: 445px;
background-color: white;
z-index: 100;
}
Regards,
Chetan Crasta
__
css-discuss [css-d@lists.css-discuss.org]
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/
Re: [css-d] CSS positioning question
On Apr 30, 2011, at 2:24 AM, Chetan Crasta chetancra...@gmail.com wrote:
Try this:
#header {
height: 50px;
margin: 0 auto -19px;
padding: 30px 0 0;
position: relative;
text-align: center;
width: 445px;
background-color: white;
z-index: 100;
}
Regards,
Chetan
Thank you for the responses. I will work on this with the help you've given me.
Much appreciated!
Rory
__
css-discuss [css-d@lists.css-discuss.org]
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] CSS positioning question
I coded this page today: http://rorybernstein.com/proto_josephine/index.html ...and it's done but for one detail: I need to move the logo down so that it sits over the top of the divd #container, which has a black border around it. When positioned correctly, the left right edges of the logo will align with the border for a continuous look, as on this comp: http://rorybernstein.com/josephine_comps/index.html The logo is in the div #header. Can anyone tell me how to get it to move down into the correct place? Thanks in advance. Rory __ css-discuss [css-d@lists.css-discuss.org] 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/
Re: [css-d] CSS positioning question
I coded this page today: http://rorybernstein.com/proto_josephine/index.html ...and it's done but for one detail: I need to move the logo down so that it sits over the top of the divd #container, which has a black border around it. When positioned correctly, the left right edges of the logo will align with the border for a continuous look, as on this comp: http://rorybernstein.com/josephine_comps/index.html The logo is in the div #header. Can anyone tell me how to get it to move down into the correct place? Thanks in advance. Rory __ Try giving the logo image a negative bottom margin. Rod Castello __ css-discuss [css-d@lists.css-discuss.org] 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-discuss [css-d@lists.css-discuss.org] 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/
Re: [css-d] CSS positioning question
On 04/29/2011 05:04 PM, Rory Bernstein wrote: I coded this page today: http://rorybernstein.com/proto_josephine/index.html ...and it's done but for one detail: I need to move the logo down so that it sits over the top of the divd #container, which has a black border around it. When positioned correctly, the left right edges of the logo will align with the border for a continuous look, as on this comp: http://rorybernstein.com/josephine_comps/index.html The logo is in the div #header. Can anyone tell me how to get it to move down into the correct place? Thanks in advance. Rory Hi, a quick mock-up with the following element style on the img left:40em; position:absolute; top:0; z-index:1; and then adding a 1em top margin to #header margin: 1em 0 0 0; Got a working version in FF. You'll want to cross-browser test that, but should be a good start. Hope that helps, Rich __ css-discuss [css-d@lists.css-discuss.org] 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/
Re: [css-d] CSS positioning question
On 4/29/11 5:04 PM, Rory Bernstein wrote:
I coded this page today:
http://rorybernstein.com/proto_josephine/index.html
...and it's done but for one detail: I need to move the logo down so that it sits
over the top of the divd #container, which has a black border around it. When
positioned correctly, the left right edges of the logo will align with the
border for a continuous look, as on this comp:
http://rorybernstein.com/josephine_comps/index.html
The logo is in the div #header. Can anyone tell me how to get it to move down
into the correct place? Thanks in advance.
Rory
Rough stab.
Delete the padding from #header.
Add and tweak these new rulesets;
body {padding-top: 70px;}
#header img {border: 1px solid red; position: absolute; top: -31px;left:
270px;}
Best,
~d
--
http://chelseacreekstudio.com/
http://chelseacreekstudio.com/fa/
__
css-discuss [css-d@lists.css-discuss.org]
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/
Re: [css-d] CSS Positioning Question
On Thursday 09 March 2006 03:11, Ramone Kalsaw wrote: Is there a css scheme for positioning div id=footer so that it will lay at the absolute bottom of the page, with every other element above it? Re: www.biom.net: http://www.biom.net/ In order to keep my footer from rising up and covering content in my main section, I've had to add about 25 br/ tags at the bottom of the leftbar page element. (And even I know in this age of CSS this is not the most elegant way to position page elements [image: sleepy.gif] Isn't this just a variation on the standard header/footer with 3 column layout in between (of course you also have content in the header and footer). I have been revamping my site and there is an example (I was puzzling over something else - which is now solved) which shows the 3 column format very clearly t, but it also has 3 columns inside the header and the footer. http://www.chandlerfamily.org.uk/testpage.html The idea was taken from http://www.alistapart.com/articles/holygrail -- Alan Chandler http://www.chandlerfamily.org.uk Open Source. It's the difference between trust and antitrust. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] CSS Positioning Question
Ramone, Here is a link that shows a way to fix the position of both the header and footer. You can adapt this to fix the position of the footer only. http://www.456bereastreet.com/lab/cssframes/ HTH, Jim On 3/8/06, Ramone Kalsaw [EMAIL PROTECTED] wrote: Is there a css scheme for positioning div id=footer so that it will lay at the absolute bottom of the page, with every other element above it? __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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] CSS Positioning Question
Ramone Kalsaw wrote: Is there a css scheme for positioning div id=footer so that it will lay at the absolute bottom of the page, with every other element above it? Bottom of the viewport: see Jim Davis' reply. Bottom of the page: Add 'clear:both;' tot the styles for the footer, and don't use position:absolute for the columns. Position:absolute takes elements out of the normal flow, which means other elements don't see them. Clear:both on the footer will only help it to stay below floats. Not below absolute positioned elements. Re: www.biom.net: http://www.biom.net/ In order to keep my footer from rising up and covering content in my main section, I've had to add about 25 br/ tags at the bottom of the leftbar page element. (And even I know in this age of CSS this is not the most elegant way to position page elements [image: sleepy.gif] It's not just not elegant, it doesn't work either :-) (Note: Right now all page elements are working fine on IE6/MyIE2 (Windows), not so good on Firefox (Windows: footer is covering icon graphic). And on Mac it's like herding cats: Safari, Firefox, and Netscape are positioning the footer at different levels.) And in Opera both the green and the transparent parts of the footer are broken by the middle column. -- Els http://locusmeus.com/ http://locusoptimus.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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/
