Footer image solid line

[designpoint 0]

Hi,

 

Trying to move down the white solid line under the image to line itself up with the lines on either side. Currently I have this CSS code but seems like it is not changing:

 

 

#footer .footerimage li {

  padding-bottom: 10%;

}

 

is this incorrect? Assistance will be much appreciated

[Rob 547]

Hi,

 

Since I cannot see your site, it's difficult to say. Is the site live? If so, please provide a link.

 

  padding-bottom: 10%; is not correct.  10px would be correct.

[designpoint 0]

sorry forgot to add...its test.propertywealthadvisors.com.au

[Rob 547]

I see you didn't add the proper class surrounding the image.

 

Here's what I need you to do:

1. Go to that footer column.

You'll see <img align="left" src="http://test.propertywealthadvisors.com.au/wp-content/uploads/2013/05/TheClarence.jpg">

Please re-write that as follows:

<div class="myclarence"><img align="left" src="http://test.propertywealthadvisors.com.au/wp-content/uploads/2013/05/TheClarence.jpg"></div>

 

2. Add the following code to Dashboard > PageLines > Site Options > Custom Code:

 

.myclarence {

margin-bottom: 65px;

}

 

Note: You may need to adjust that 65px, since it is not exact, only a demonstration.

 

Another way of doing it would be to add a specific height to the image HTML itself.  Like this:

 

<img align="left" src="http://test.propertywealthadvisors.com.au/wp-content/uploads/2013/05/TheClarence.jpg" height="81px">

 

One problem I can see is that you're using a massive image scaled really small.  That will do two things: First, it will not work in IE, especially older versions, and next it will slow your page's load time. I'd recommend using a graphics editor to make a copy of the image and scale it graphically to the desired size. Upload that size, and still keep the height requirements.

 

Keep in mind, you've added an unspecified element to that content.  The white line only sees a short line of code, and doesn't see the desired height, nor does it see any height at all. So, the line acts as if it's only a single line break.  If you specify a height, then the white line will adjust to meet the specification.

[designpoint 0]

I have added as you suggested but still no affect to the line for some reason?

[Rob 547]

Hi,

 

Well the div didn't work with the margin, so let's try replacing margin-bottom: 65px; with height: 81px;

 

Or, as I suggested in the second part of the reply, add height="81px" to the image HTML tag.