- This topic is empty.
-
AuthorPosts
-
May 20, 2016 at 11:39 am #241923bbsemailParticipant
Odd issue; I’ve got a classified ad page for a car club I help with a title row/div, then 2 column div layout for the photo ads, followed by a contact row/div
http://hcca.org/classifieds.php?carsFor some reason, most browsers are adding a bunch of extra “space” below the photo and text columns before the contact the advertiser row/div and I can’t figure out why. It doesn’t happen on the text only / single column layout ads below the picture ads using .
What’s causing this on desktops? Small screens go to single column. Thanks. Here’s the css for the ads:
.piccol{width:36.75%;float:left;text-align:center}
.txtcol{width:63.25%;float:right;text-align:left; padding-left:3%; padding-right:2%; font-family: “bookman old style”,”century schoolbook”; font-size: 1.5rem; font-style: normal; color: black}
.txtad{margin-left:1.0rem}
The text only ads using the txtad class don’t have the problem, but the 2 column ads using piccol and txtcol do
May 20, 2016 at 11:53 am #241924bearheadParticipantI see a couple of things going on
- all the .piccol divs have a height applied to them inline i.e. (style=”height:26rem”).
- There are a few goofy elements in the .piccol divs: a couple empty p tags, and one p tag with nothing but a non-break space in it. -You should remove all of these.
Also, I see center elements in there. You should get rid of those too. They are depreciated in html 5
May 20, 2016 at 7:06 pm #241930bbsemailParticipantThanks, sloppy code is sloppy code. <center> tag was there because the overly voluminous text-align:center wasn’t working.
piccol height should be height of picture plus 3.5rem for a description line; thanks for catching the hard coded height error.
Now, I must have errors in my css/ad.css file as most of it’s styles aren’t being applied and I had to add them to the classifieds.php page. Not sure what I changed there.
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.