Re: [WSG] tableless layout stuff
on 06/03/06 16:57 Christian Montoya said the following: On 3/5/06, Jack Pivac [EMAIL PROTECTED] wrote: Hi Everyone, Few questions: http://temp.delphinus.co.nz/newsite/shop/shop.php?product=accessories I'm using white-space: pre; so dont have to br every line in the green description stuff... but if the window is resized it doesn't wrap AT ALL... is there a better way to do this? Sorry, but you would have to use 'br' or a list. Pre wrapped text does not break, that's how it behaves. Ok thats fine, I've just used some php to add the 'br's in automatically. But does anyone have any idea how to put that alongside the title and image etc without using a table? or should i just use a table? Cheers, Jack ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] tableless layout stuff
On 07/03/06, Jack Pivac [EMAIL PROTECTED] wrote: But does anyone have any idea how to put that alongside the title andimage etc without using a table? or should i just use a table? The simplest way would be to wrap the bits you want to have on the left (title, pic, price, etc) in some sort of containing element such as a div and float it left. I'd suggest floating your green paragraph to the right, but that would require it to come first in the source I believe, and that's probably not a good idea. If nothing else, it will realy confuse people who don't get the benefit of CSS (older browsers, text browser, screen readers, etc) to see the details before the title! ;) Cheers, Seona.
Re: [WSG] tableless layout stuff
on 07/03/06 12:17 Seona Bellamy said the following: On 07/03/06, *Jack Pivac* [EMAIL PROTECTED] mailto:[EMAIL PROTECTED] wrote: But does anyone have any idea how to put that alongside the title and image etc without using a table? or should i just use a table? The simplest way would be to wrap the bits you want to have on the left (title, pic, price, etc) in some sort of containing element such as a div and float it left. I'd suggest floating your green paragraph to the right, but that would require it to come first in the source I believe, and that's probably not a good idea. If nothing else, it will realy confuse people who don't get the benefit of CSS (older browsers, text browser, screen readers, etc) to see the details before the title! ;) Cheers, Seona. but if i float it left.. then doesn't that mean i have the wrap the whole lot in another div.. and overflow: auto; that, which requires a width for it to work in IE... but was after a more liquid layout... Open to any ideas. ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] tableless layout stuff
Jack wrote: But does anyone have any idea how to put that alongside the title and image etc without using a table? or should i just use a table? Hi Jack, There shouldnt be any need for a table here. just mark your list up as a list and float your image to one side. something like this: http://c41.com.au/test/delphinus_example/index.html (css in the head so just view source) hoping thats what you meant :) pete ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] tableless layout stuff
On 07/03/06, Jack Pivac [EMAIL PROTECTED] wrote: The simplest way would be to wrap the bits you want to have on the left (title, pic, price, etc) in some sort of containing element such as a div and float it left.but if i float it left.. then doesn't that mean i have the wrap the whole lot in another div.. and overflow: auto; that, which requires awidth for it to work in IE... but was after a more liquid layout...Open to any ideas. I'm not sure why you feel you need to use overflow:auto... Wrap them in a div, yes, and then give it a width based on one of two factors: 1) If the image will always be the same width and you want the details to sit fairly close beside them, make the div a little wider than the image (eg: if the image is 100px, make the div 120px). 2) Give the div a width of, say 50% or some other percentage - that way it will always occupy a relative amount of space regardless of the width of the content block and the details will all line up neatly in the other half of the page. All you need to do then is use some sort of clearing element ( I tend to favour PIE's Easy Clearing method [1]) under the details to make content below respect the height of the floated bits. Cheers, Seona. [1] http://www.positioniseverything.net/easyclearing.html
Re: [WSG] tableless layout stuff
on 07/03/06 12:29 Peter Ottery said the following: Jack wrote: But does anyone have any idea how to put that alongside the title and image etc without using a table? or should i just use a table? Hi Jack, There shouldnt be any need for a table here. just mark your list up as a list and float your image to one side. something like this: http://c41.com.au/test/delphinus_example/index.html (css in the head so just view source) hoping thats what you meant :) pete Thats a much better idea! cheers i'll give that go now :) ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
[WSG] tableless layout stuff
Hi Everyone, Few questions: http://temp.delphinus.co.nz/newsite/shop/shop.php?product=accessories I'm using white-space: pre; so dont have to br every line in the green description stuff... but if the window is resized it doesn't wrap AT ALL... is there a better way to do this? And is there a way to put the green text up at the same height, and to the right of the title and image please? So we have: Title Pic{description} price etc Many Thanks, Jack ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] tableless layout stuff
On 3/5/06, Jack Pivac [EMAIL PROTECTED] wrote: Hi Everyone, Few questions: http://temp.delphinus.co.nz/newsite/shop/shop.php?product=accessories I'm using white-space: pre; so dont have to br every line in the green description stuff... but if the window is resized it doesn't wrap AT ALL... is there a better way to do this? Sorry, but you would have to use 'br' or a list. Pre wrapped text does not break, that's how it behaves. -- -- Christian Montoya christianmontoya.com ... rdpdesign.com ... cssliquid.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **