Thu, 2016-05-19 17:19
As someone who does not do a lot with CSS, I am trying to find the correct code to fix the layout issue at the bottom of my page:
www.clioassociates.net
I did purchase this template and am aware there is a lot of extra code/tags that are not needed. My main concern at this time is how to correct the logo/address at the bottom so they display correctly on mobile devices (and yes, I am also guilty of using a table at the bottom)!
Many thanks in advance,
Jenn
<div class="container"> <div class="row"> <div class="footer"> <div class="footerLeft"><img src="images/ClioLogo_footer.png" width="215" height="81"></div> <div class="footerRight"> <table width="90%" cellspacing="20px"> <tr> <td width="50%">P. O. Box 60534<br> Northampton, MA 01062<br> 413-586-9220</td> <td width="50%"> 197 8th Street<br /> Boston MA 02129<br /> 413-586-9220</td> </tr> <tr> <td colspan="2" align="center"><br /><a href="mailto:[email protected]">dkenny@clioassociates.net</a> | Hours by Appointment</td> </tr> </table> </div> </div> </div> </div>
//mod edit: [code] … [/code] tags added. ~gt
Thu, 2016-05-19 19:29
#1
Hi Jenn, The table has a
Hi Jenn,
The table has a width of 750px.
You need to start by changing that,
Decide how you want the footer to look in mobile.
You may want to hide the tableright on small screens using media queries.
@media only screen and (max-width: 600px) { .footerRight{ display:none; } }
Fri, 2016-05-20 19:48
#2
Thank you so much, Tony! Can
Thank you so much, Tony! Can you offer advice as to how to hide it? Again...noob!!! :/
Fri, 2016-05-20 23:44
#3
Hi Jenn, That should hide it
Hi Jenn,
That should hide it when the browser width is less then 600px
You probably want to play around with the values to find the right point to hide it and change size.