Jump to content


Photo
- - - - -

Footer image solid line


  • Please log in to reply
5 replies to this topic

#1 designpoint

designpoint

    Advanced Member

  • Members
  • 59 posts
  • Country: Country Flag

Posted 06 May 2013 - 10:35 PM

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



#2 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 06 May 2013 - 10:48 PM

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.



#3 designpoint

designpoint

    Advanced Member

  • Members
  • 59 posts
  • Country: Country Flag

Posted 06 May 2013 - 10:51 PM

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



#4 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 06 May 2013 - 11:27 PM

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="

Please Login or Register to see this Hidden Content

">

Please re-write that as follows:

<div class="myclarence"><img align="left" src="

Please Login or Register to see this Hidden Content

"></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="

Please Login or Register to see this Hidden Content

" 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.



#5 designpoint

designpoint

    Advanced Member

  • Members
  • 59 posts
  • Country: Country Flag

Posted 07 May 2013 - 12:04 AM

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



#6 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 07 May 2013 - 12:10 AM

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.