Solved

image on right floats over footer address bar

Posted on 2014-02-28
12
340 Views
Last Modified: 2014-02-28
How do I make it so that the footer always goes below the long image on the right.  I thought the <br class="clearfloat" /> would fix it but it isn't.

.clearfloat {
      clear:both;
      height:0;
      font-size: 1px;
      line-height: 0px;
}

http://nsitedesigns.com/nsitedesigns/lakeshore/freestanding.html
0
Comment
Question by:nsitedesigns
12 Comments
 
LVL 8

Expert Comment

by:Mandeep Khalsa
ID: 39895218
One way would be to use the minimum height for your content div.

.content
{
min-height:100px;
}
0
 
LVL 6

Expert Comment

by:M. Jayme Nagy
ID: 39895220
do you want the footer to stretch across the entire screen ??

im not quite sure what you mean it loscreen shotoks like this to me
0
 
LVL 58

Accepted Solution

by:
Gary earned 500 total points
ID: 39895243
Move this
<div class="display"><img width="259" height="606" alt="Lakeshore POP Display" src="img/display_bluecross.png"></div>

into your sidebar and set the css to just this (nothing else - remove the position etc)
.display {
    float: right;
}
0
 

Author Comment

by:nsitedesigns
ID: 39895249
The footer goes OVER the display on the right.  I would like footer to be situated LOWER than the display so that they do not touch.
0
 

Author Closing Comment

by:nsitedesigns
ID: 39895257
i'll be dipped!  worked like a charm.  Thanks Cathal!
0
 

Author Comment

by:nsitedesigns
ID: 39895298
While it worked I now need to move display away from right margin a tad. I can't add padding or margin on  the right to a right floated image.  The sidebar is floated to the right too.  If I change the container, it will mess up the site.  What do you suggest I do?  Ideally, I would like to add 30px right margin or padding to the display.
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 58

Expert Comment

by:Gary
ID: 39895310
Add padding-right: 30px; to .sidebar1{} or .display {}
0
 

Author Comment

by:nsitedesigns
ID: 39895326
I thought you should NEVER add padding OR margin to something that is floated in the same direction.  Both of these divs are floated right.....
0
 
LVL 58

Expert Comment

by:Gary
ID: 39895355
Says who?
0
 

Author Comment

by:nsitedesigns
ID: 39895871
I am not sure where I heard this (and it was years ago) but it was a very strict rule that you were to never ever break.  I did add a margin to the float and it took so I guess that was maybe an old rule.
0
 
LVL 58

Expert Comment

by:Gary
ID: 39895888
Ahh rules are there for breaking!
0
 

Author Comment

by:nsitedesigns
ID: 39896020
I feel so naughty!  LOL
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
This article discusses how to create an extensible mechanism for linked drop downs.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.

937 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now