Re: [css-d] Positioning problem
At least part of why it is confusing to get those javascript rotating images to
place correctly is because there are two properties controlling them:
/* - rotator in-page placement - */
div#rotator {
background: #000;
width:300px;
position: relative;
z-index: 1;
padding: 0;
margin: 0;
text-align: center;
}
/* rotator css */
div#rotator span {
float:right;
position:absolute;
list-style: none;
left: 459px;
top: -360px;
I don't know javascript so I'm fumbling around some here. When I change
div#rotator span (the style that places the image within the page to relative,
they are no longer contained in the same place. When they rotate through they
appear all over the page.
Is it possible that this is a case where the absolute positioning is required?
Any help is greatly appreciated!
Matthew
On Apr 6, 2010, at 3:52 PM, Matthew wrote:
Thank you, but when I float: left the div containing the text, and float:
right the image, the image vanishes and the crowd at the bottom is no longer
behind the next. Nor does it stop at the right point if the browser becomes
too small.
On Apr 6, 2010, at 3:42 PM, David Laakso wrote:
Matthew wrote:
Hi everyone,
Please check out this site:
www.em-w.com/oldschoolband
Can someone help me figure out how to control the positioning of the image
in the right side without using absolute positioning? I can't do it! I
can't make objects appear next to each other with relative positioning; I
can only stack them. I realize absolute positioning is not the way to go
here, but its all I can do. I also notice that it appears in different
places depending on the browser I'm using. I'm not getting something
fundamental about CSS. Please help if you think you can.
Thank you!
Matthew
Simple: float.
http://chelseacreekstudio.com/ca/cssd/3.htm
Best,
~d
--
desktop
http://chelseacreekstudio.com/
mobile
http://chelseacreekstudio.mobi/
__
css-discuss [cs...@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 [cs...@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 [cs...@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] Positioning problem
Matthew wrote: Thank you, but when I float: left the div containing the text, and float: right the image, the image vanishes and the crowd at the bottom is no longer behind the next. Nor does it stop at the right point if the browser becomes too small. Man, Otis is going to drive everyone on this list nuts-- and then some. http://chelseacreekstudio.com/ca/cssd/otis.htm Switched to jquery on ap. See change in CSS and markup. Best, ~d PS Bottom post, please. -- desktop http://chelseacreekstudio.com/ mobile http://chelseacreekstudio.mobi/ __ css-discuss [cs...@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] Positioning problem
Matthew wrote: Hi everyone, Please check out this site: www.em-w.com/oldschoolband Can someone help me figure out how to control the positioning of the image in the right side without using absolute positioning? I can't do it! I can't make objects appear next to each other with relative positioning; I can only stack them. I realize absolute positioning is not the way to go here, but its all I can do. I also notice that it appears in different places depending on the browser I'm using. I'm not getting something fundamental about CSS. Please help if you think you can. Thank you! Matthew Simple: float. http://chelseacreekstudio.com/ca/cssd/3.htm Best, ~d -- desktop http://chelseacreekstudio.com/ mobile http://chelseacreekstudio.mobi/ __ css-discuss [cs...@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] Positioning problem
Thank you, but when I float: left the div containing the text, and float: right the image, the image vanishes and the crowd at the bottom is no longer behind the next. Nor does it stop at the right point if the browser becomes too small. On Apr 6, 2010, at 3:42 PM, David Laakso wrote: Matthew wrote: Hi everyone, Please check out this site: www.em-w.com/oldschoolband Can someone help me figure out how to control the positioning of the image in the right side without using absolute positioning? I can't do it! I can't make objects appear next to each other with relative positioning; I can only stack them. I realize absolute positioning is not the way to go here, but its all I can do. I also notice that it appears in different places depending on the browser I'm using. I'm not getting something fundamental about CSS. Please help if you think you can. Thank you! Matthew Simple: float. http://chelseacreekstudio.com/ca/cssd/3.htm Best, ~d -- desktop http://chelseacreekstudio.com/ mobile http://chelseacreekstudio.mobi/ __ css-discuss [cs...@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 [cs...@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] Positioning problem
Matthew wrote: Thank you, but when I float: left the div containing the text, and float: right the image, the image vanishes and the crowd at the bottom is no longer behind the next. Nor does it stop at the right point if the browser becomes too small. Simple: float. http://chelseacreekstudio.com/ca/cssd/3.htm Best, ~d Ask Alan. ~d -- desktop http://chelseacreekstudio.com/ mobile http://chelseacreekstudio.mobi/ __ css-discuss [cs...@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] Positioning problem
Do you mean Alan Gresely, the person who helped me with this site a few days ago? Send him a direct email? I hope my problems aren't too basic or dumb. I'm asking in the spirit of the information page of this list, which states: My philosophy is that there are two kinds of questions: good questions and unasked questions. I much prefer the former. It doesn't matter how dumb you think the question might be, because I guarantee you that at least five other subscribers are wondering the same thing, and will learn from the answer. How do I position a background image? is as valid a question as Why does this 15KB stylesheet almost but not quite work in Opera when I use an HTML4.01 Frameset DOCTYPE? Thanks for your help! Matthew On Apr 6, 2010, at 4:02 PM, David Laakso wrote: Matthew wrote: Thank you, but when I float: left the div containing the text, and float: right the image, the image vanishes and the crowd at the bottom is no longer behind the next. Nor does it stop at the right point if the browser becomes too small. Simple: float. http://chelseacreekstudio.com/ca/cssd/3.htm Best, ~d Ask Alan. ~d -- desktop http://chelseacreekstudio.com/ mobile http://chelseacreekstudio.mobi/ __ css-discuss [cs...@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 [cs...@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] Positioning problem
Matthew wrote: Do you mean Alan Gresely, the person who helped me with this site a few days ago? Yes. ~d -- desktop http://chelseacreekstudio.com/ mobile http://chelseacreekstudio.mobi/ __ css-discuss [cs...@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] positioning problem
[EMAIL PROTECTED] wrote:
http://free.of.pl/r/ramirez/temp/index.htm
What I'm trying to do is to put the navigation on the right side of
the container.
To absolute position it, add...
#Content {
position: relative;
}
...to establish a relation for A:P.
Then use these nav-styles...
#navlist {
border-bottom: 1px solid gray;
width: 200px;
position: absolute;
right: 1px;
top: 150px;
margin: 0;
padding: 0;
}
Adjust 'top' to taste.
regards
Georg
--
http://www.gunlaug.no
__
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/
Re: [css-d] positioning problem
Add these properties to your #navlist -
#navlist
{
float: left;
border-bottom: 1px solid gray;
width: 200px;
*position:absolute;
right: 10px;
top: 20px;*
}
Alternatively, you could also block out content using divs to achieve some
fine control over your layout.
- Mustafa
__
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/
Re: [css-d] positioning problem
Go on then. -- http://www.web-buddha.co.uk __ 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] positioning problem
Diego Chagastelles wrote: Hi, I want to make a layout on which elements float in the bottom right of the page, like Gmail chat. Do you have a link that shows what you mean? I did not come up with anything that looks like what you describe in a quick Google search of Gmail chat. ~dL -- http://chelseacreekstudio.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/
Re: [css-d] Positioning problem
Steven Olson wrote: In IE there is a small band where the background shows through between the logo area and the text area. The problem persists when the div containing the menu is commented out in the html. Steven, Try removing the white space before this closing DIV: src=Simply Annie's website template_files/banner-top.gif border=0 /div --^ Thierry | www.TJKDesign.com __ 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] Positioning problem
Steven Olson wrote: http://www.fofex.com/simply_annies/template.html In IE there is a small band where the background shows through between the logo area and the text area. The problem persists when the div containing the menu is commented out in the html. Hee-hee! It's the old images-in-table-and-whitespace-in-the-code problem. The space isn't between the DIV's. It's _in_ the #logo-area DIV. img src=images/banner-top.gif border=0 alt=/div ^^ Write the above on one line without whitespace between tags. :-) pandy __ 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] Positioning problem
Try removing the white space before this closing DIV: src=Simply Annie's website template_files/banner-top.gif border=0 /div Thanks, Thierry and Pandy That did the trick. I was careful to not leave in inay spaces, but I guess the CR/LF counted as a space. Kind regards, Steven Olson __ 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] Positioning problem in IE
Mike Davies wrote: Can anyone suggest a solution? first validate your html and correct those errors. then validate your css and correct those errors. the css will not validate now until you fix the html. your li borders are not being contained by the ul. they stick out to the right of the column. there are design flaws that need to be corrected as well, but they are cosmetic. validate, fix and then come back. regards, dwain -- Dwain Alford [EMAIL PROTECTED] http://www.alforddesigngroup.com The artist may use any form which his expression demands; for his inner impulse must find suitable expression. Wassily Kandinsky, Concerning The Spiritual In Art __ 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] Positioning problem in IE [addendum]
observed in ff 1.04 w2k sp4 -- Dwain Alford [EMAIL PROTECTED] http://www.alforddesigngroup.com The artist may use any form which his expression demands; for his inner impulse must find suitable expression. Wassily Kandinsky, Concerning The Spiritual In Art __ 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/
IE Mac use was Re: [css-d] Positioning problem in IE
Any self-respecting Mac user that bought a Mac in the early iBook or iMac days is probably using IE Mac. I personally know three of them. They don't have enough money to upgrade to a Mac that runs X and they don't know that there is anything so awful about IE Mac. They will just know that your page doesn't work. -Christy First, I would drop my concern over how it looks in Mac/IE. I just recently trashed my copy of this worthless piece of cyber-trash. I will no longer design taking Mac/IE into account, based on two reasons. First because it is used by less than 1% of the viewing public and secondly because no self-respecting Mac-user would be using it as their primary browser. As to the rest of your problem, I am sure that someone will come along who will give you insight into this universal problem: how to deal with that other piece of crap, Windows/IE. __ 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] Positioning problem in IE
On 13 Jun 2005, at 7:58 pm, Mike Davies wrote: Also in MacIE5 the right column looks OK but the main image doesn't appear which I can't understand as the image appears in the design this was adapted from and I only changed the file name. view at www.a-ridge-too-far.com/index.htm css - www.a-ridge-too-far.com/fallago2.css For the 35% to 45% of Mac Users who still use IE Mac in my stats, your little problem is quite simple to fix: wrap your image in a block level tag (I wrapped it in a p), and whoopla, the image is back. (IE Mac likes semantically rich mark-up) PS- you might need to style that p with margin:0; padding:0; didn't check that far. Philippe --- Philippe Wittenbergh http://emps.l-c-n.com/ __ 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/
