Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS 2 column div layout seems to have a minimum height

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #241923
    bbsemail
    Participant

    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?cars

    For 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

    #241924
    bearhead
    Participant

    I see a couple of things going on

    1. all the .piccol divs have a height applied to them inline i.e. (style=”height:26rem”).
    2. 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

    #241930
    bbsemail
    Participant

    Thanks, 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.

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.