Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > clear:left problems

Reply
Thread Tools

clear:left problems

 
 
Malcolm Collett
Guest
Posts: n/a
 
      01-19-2004
On this page:
http://users.iafrica.com/m/mc/mcolle...tle/Castle.htm
I am having some problems with clear:left.

Below the Gladiator Castle div is a <hr> with clear:left on it. What I would
like is that <hr> should clear the photo in the same div, but it is clearing
nav list as well. This results in a large blank space below the photo.
How do I get rid of this blank space?

(I tried floating the photos to the right and using clear:right on the <hr>,
but then the image of the main content div leaks to the left and fills the
space below the nav list.)

Malcolm


 
Reply With Quote
 
 
 
 
Lauri Raittila
Guest
Posts: n/a
 
      01-19-2004
In article Malcolm Collett wrote:
> On this page:
> http://users.iafrica.com/m/mc/mcolle...tle/Castle.htm
> I am having some problems with clear:left.
>
> Below the Gladiator Castle div is a <hr> with clear:left on it. What I would
> like is that <hr> should clear the photo in the same div, but it is clearing
> nav list as well. This results in a large blank space below the photo.
> How do I get rid of this blank space?


Use absolute postioning for your navigation. It works just as well as
float, as you already use margin for content.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Saapi lähettää meiliä, jos aihe ei liity ryhmään, tai on yksityinen
tjsp., mutta älä lähetä samaa viestiä meilitse ja ryhmään.

 
Reply With Quote
 
 
 
 
Paul Furman
Guest
Posts: n/a
 
      01-19-2004
Malcolm Collett wrote:

> On this page:
> http://users.iafrica.com/m/mc/mcolle...tle/Castle.htm
> I am having some problems with clear:left.
>
> Below the Gladiator Castle div is a <hr> with clear:left on it. What I would
> like is that <hr> should clear the photo in the same div, but it is clearing
> nav list as well. This results in a large blank space below the photo.
> How do I get rid of this blank space?
>
> (I tried floating the photos to the right and using clear:right on the <hr>,
> but then the image of the main content div leaks to the left and fills the
> space below the nav list.)


Strange: in IE6 if I scroll down then back up a gap revealing the
background image apprears. Before that I can see a slight diff in width
of the foreground color where the menu cuts into it. It works as you
wish in mozilla.

 
Reply With Quote
 
Malcolm Collett
Guest
Posts: n/a
 
      01-20-2004

"Lauri Raittila" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
> In article Malcolm Collett wrote:
> > On this page:
> > http://users.iafrica.com/m/mc/mcolle...tle/Castle.htm
> > I am having some problems with clear:left.
> >
> > Below the Gladiator Castle div is a <hr> with clear:left on it. What I

would
> > like is that <hr> should clear the photo in the same div, but it is

clearing
> > nav list as well. This results in a large blank space below the photo.
> > How do I get rid of this blank space?

>
> Use absolute postioning for your navigation. It works just as well as
> float, as you already use margin for content.


Thanks Lauri

I ended up making just one small change.
I replaced
#NavLeft {float:left; ...}
with
#NavLeft {position:absolute; left:0; ...}
I haven't specified top, right or bottom, as they should default to auto.

Is this useage of position:absolute correct? Works great in IE!

Malcom



 
Reply With Quote
 
altamir
Guest
Posts: n/a
 
      01-20-2004
"Malcolm Collett" <(E-Mail Removed)> wrote in news:400cdb84.0
@news1.mweb.co.za:

> I ended up making just one small change.
> I replaced
> #NavLeft {float:left; ...}
> with
> #NavLeft {position:absolute; left:0; ...}
> I haven't specified top, right or bottom, as they should default to auto.
>
> Is this useage of position:absolute correct? Works great in IE!


Many people use absolute positioning. Floating is badly supported,
specially in IE.
One more thing: remove background-image declaration from #NavLeft, because
you've got it already in the 'body' element. Make it transparent.

--
altamir
 
Reply With Quote
 
Malcolm Collett
Guest
Posts: n/a
 
      01-21-2004
> One more thing: remove background-image declaration from #NavLeft, because
> you've got it already in the 'body' element. Make it transparent.
>
> --
> altamir


Thanks, will do.
Malcolm


 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Saving the web, charset problems and symbols problems Sak Na rede Ruby 0 01-30-2009 05:05 AM
Problems, problems for newbie Shelly ASP .Net 1 09-03-2007 02:10 AM
Problems compiling simple C++ code (also problems with std::string) Susan Baker C++ 2 06-26-2005 01:43 AM
Re: sound problems and modem problems Harold Potter Computer Support 5 12-04-2003 04:12 PM



Advertisments