'clear' help needed
 

I already know this displays improperly in FireFox. One problem at a time,
please.

The problem I'm asking for help with, specifically, is best demonstrated in
http://aljones.us/630817vad.html I've introduced a 'clear left' into the
css because the images of the diary entries, where longer than the
assiciated text, would force the next image to the right. I inserted a
clear left to the <p> tag, which gives me the display you see now.

Obviously <hah??> what I'd like to see is the image on the left, with the
associated text to the right. If the image is longer, then force the
following image / text pair down until the image places itself properly to
the left.

I've had this up in alt.html.critique, but since I'm adressing particular
issues thought I should move it to a more appropriate newsgroup.

Since I'm not (obviously) a web designer, and this is strictly a family
project I'll take all suggestions you're willing to offer - and pointers to
the solution would also be willingly accepted.

thanks //al

Re: 'clear' help needed
 

On Sat, 6 Jan 2007 21:24:21 -0600, al jones wrote:

> I already know this displays improperly in FireFox. One problem at a time,
> please.
>
> The problem I'm asking for help with, specifically, is best demonstrated in
> http://aljones.us/630817vad.html I've introduced a 'clear left' into the
> css because the images of the diary entries, where longer than the
> assiciated text, would force the next image to the right. I inserted a
> clear left to the <p> tag, which gives me the display you see now.
>
> Obviously <hah??> what I'd like to see is the image on the left, with the
> associated text to the right. If the image is longer, then force the
> following image / text pair down until the image places itself properly to
> the left.
>
> I've had this up in alt.html.critique, but since I'm adressing particular
> issues thought I should move it to a more appropriate newsgroup.
>
> Since I'm not (obviously) a web designer, and this is strictly a family
> project I'll take all suggestions you're willing to offer - and pointers to
> the solution would also be willingly accepted.
>
> thanks //al

belatedly validated both the css and html. Fixed the 'apostrophe' in the
html. Checked again after correcting and that was the only error to
surface. //al

Re: 'clear' help needed
 

On Sat, 06 Jan 2007 21:24:21 -0600, al jones wrote:

> I already know this displays improperly in FireFox. One problem at a time,
> please.
>
> The problem I'm asking for help with, specifically, is best demonstrated in
> http://aljones.us/630817vad.html I've introduced a 'clear left' into the
> css because the images of the diary entries, where longer than the
> assiciated text, would force the next image to the right. I inserted a
> clear left to the <p> tag, which gives me the display you see now.
>
> Obviously <hah??> what I'd like to see is the image on the left, with the
> associated text to the right. If the image is longer, then force the
> following image / text pair down until the image places itself properly to
> the left.

p img {clear: left; } might be what you're looking for?
Browser support for clear is not universal. I try to avoid it when
possible.

Re: 'clear' help needed
 

On Sun, 07 Jan 2007 15:32:50 GMT, mbstevens wrote:

> On Sat, 06 Jan 2007 21:24:21 -0600, al jones wrote:
>
>> I already know this displays improperly in FireFox. One problem at a time,
>> please.
>>
>> The problem I'm asking for help with, specifically, is best demonstrated in
>> http://aljones.us/630817vad.html I've introduced a 'clear left' into the
>> css because the images of the diary entries, where longer than the
>> assiciated text, would force the next image to the right. I inserted a
>> clear left to the <p> tag, which gives me the display you see now.
>>
>> Obviously <hah??> what I'd like to see is the image on the left, with the
>> associated text to the right. If the image is longer, then force the
>> following image / text pair down until the image places itself properly to
>> the left.
>
> p img {clear: left; } might be what you're looking for?
> Browser support for clear is not universal. I try to avoid it when
> possible.

I read that as doing a clear left for each p or img, is that correct??

As the pages are currently laid out I have an h2 followed by an <h3>
followed by a <p> which are (probably repeated for different dates on the
same page). Your solution to this would be ....?? because I obviously
don't know what I'm doing with it.

//al

Re: 'clear' help needed
 

mbstevens wrote:
>
> p img {clear: left; }
> Browser support for clear is not universal.

Really? Which CSS-capable browsers don't support it, or don't support it
correctly?

--
Berg

Re: 'clear' help needed
 

al jones wrote:
> On Sun, 07 Jan 2007 15:32:50 GMT, mbstevens wrote:
>
>> On Sat, 06 Jan 2007 21:24:21 -0600, al jones wrote:
>>
>>> http://aljones.us/630817vad.html
>>
>> p img {clear: left; }
>
> I read that as doing a clear left for each p or img, is that correct??

No, it's a descendant selector.
http://www.w3.org/TR/CSS21/selector....dant-selectors

The suggestion above won't work in your case because you don't have
those images inside <p> elements.

One thing you could do is to put the <a> and image inside the associated
h3 element. Adding a clear:left to all h3's should always put the next
entry below any images.
<h3><a href...><img...></a>Thur. Aug. 20, 1863</h3>

h3 {clear:left}
h3 img {float:left; margin:...}

The other option is to add a class selector to each h3 that specifically
needs to be cleared, or add an inline style to them.

--
Berg

Re: 'clear' help needed
 

In article <pan.2007.01.07.15.36.13.330266@xmbstevensx.com> ,
mbstevens <NOXwebmasterx@xmbstevensx.com> wrote:

> Browser support for clear is not universal. I try to avoid it when
> possible.

I am usually comfortable using it. There is an issue with
inheritance on Mac IE 5 which I bump up against now and then and
could recall if I have to... something to do with clear being
inherited in spite of child elements not being cleared or being
specifically not cleared. Easy enough to fix for this browser
with css that talks to it.

Came across a little case of my own yesterday that puzzled me -
excuse me OP - for a while and I dropped using clear: (though it
seemed so right!), instead I used margins to solve the little
problem. I am now thinking I have to think through the concepts
of floats more!

In case anyone is interested, I was supposing that when you have
a box and float stuff in it, subsequent clears in that box would
apply only to the floats in that box. But yesterday I had a clear
that took account of another float outside the box. Or sure
seemed to!

Simple enough really though: page had a left floated nav col and
a right content div box (margined to give the left nav float a
formal space to sit in). Inside the div content box, at the very
start I had a little float (to accommodate one drop-cap letter -
it is all Farmer Joe's fault), for a little one line sentence.
The point is that when I cleared the float for the next heading,
the heading jumped down to clear the nav floated box. It is no
good me knowing this is "correct" behaviour. I need to think
about it more not to be puzzled! Perhaps I have missed something
quite simple and if fixed, can go back to using clear properly!

URL? OK (click on the link "Blue" and "Maroon" - there only
temporarily to show some people possible backgrounds - to see the
difference re clear):

<http://members.optushome.com.au/droovies/khs/>

--
dorayme

Re: 'clear' help needed
 

On Mon, 08 Jan 2007 11:04:50 +1100, dorayme wrote:

> In article <pan.2007.01.07.15.36.13.330266@xmbstevensx.com> ,
> mbstevens <NOXwebmasterx@xmbstevensx.com> wrote:
>
>> Browser support for clear is not universal. I try to avoid it when
>> possible.
>
> I am usually comfortable using it. There is an issue with
> inheritance on Mac IE 5 which I bump up against now and then and
> could recall if I have to... something to do with clear being
> inherited in spite of child elements not being cleared or being
> specifically not cleared. Easy enough to fix for this browser
> with css that talks to it.


It is buggy in IE4.x, Navigator 4.x, and Opera 3.6.,
and completely unsupported in iCab 2.6-2.9.x.
Not exactly a herd of people still using these, but
I'm still holding off for a while.

Re: 'clear' help needed
 

mbstevens wrote:
>>
>>> Browser support for clear is not universal.
>
> It is buggy in IE4.x, Navigator 4.x, and Opera 3.6.,
> and completely unsupported in iCab 2.6-2.9.x.

Do you honestly think that the 3 people on the planet still using any of
these antiquated browsers haven't come across worse problems before now?
I find it inconceivable that those users would be running with CSS
enabled at all.

--
Berg

Re: 'clear' help needed
 

On Sun, 07 Jan 2007 22:16:54 -0600, Bergamot wrote:

> mbstevens wrote:
>>>
>>>> Browser support for clear is not universal.
>>
>> It is buggy in IE4.x, Navigator 4.x, and Opera 3.6.,
>> and completely unsupported in iCab 2.6-2.9.x.
>
> Do you honestly think that the 3 people on the planet still using any of
> these antiquated browsers haven't come across worse problems before now?

This problem has no necessary relation to those problems. People with
bad knees are still capable of fretting over hangnails.

> I find it inconceivable that those users would be running with CSS
> enabled at all.

I find it conceivable.