problem on making 2 horizontal blocks to have same height

Discussion in 'CSS' started by Mario Poon, Mar 20, 2013.

0
  1. #1
    hi guys,

    On my website page tdever.com, there are two blocks on top left of the page, the first block containing an image and has a fixed height 270px, the second block containing flexible texts, now the problem is both blocks do not have same height on all browsers, after couple tests, it looks ok on mac (ff, safari chrome), but bad looking on windows(ff), so i am asking if you guys have a good solution for this problem, what i want is both blocks have always same height without cutting or hiding the texts.

    thanks!
     
    Mario Poon, Mar 20, 2013 IP
  2. artus.systems

    artus.systems Well-Known Member

    Messages:
    87
    Likes Received:
    1
    Best Answers:
    1
    Trophy Points:
    103
    #2
    Removing padding fixed in Chrome and FF
    .coin-slider {
    overflow: hidden;
    padding: 5px 0; /* remove this*/
    position: relative;
}
    HTML:
     
    artus.systems, Mar 21, 2013 IP
  3. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #3
    Of course they're not the same, you have a fixed element and one with dynamic text -- they should NEVER be the same, by design.

    What you are asking for can be 'faked' after a fashion, but really it falls into either "but I can do it in photoshop" or "Not viable for web deployment" thinking.

    Though really that whole page suffers from that... Well, that and link-overload Yahoo style. (part of why it's shocking Y! is still even in business)
     
    deathshadow, Mar 21, 2013 IP