2012-02-12 35 views
5

Vì vậy, tôi vừa mất vài giờ trong cuộc đời mình để giành chiến thắng trong trận chiến này, không có may mắn. Tóm lại, tôi đang cố gắng điền vào một bảng có ba hình ảnh 10px, nhưng GMail buộc mỗi ô phải là 16px. Dưới đây là những gì tôi đang làm việc với:GMail buộc TD chứa spacer.gif cao 16px

<table border="0" cellpadding="0" cellspacing="0" width="550" style="height:10px !important"> 
    <tr style="height:10px" height="10"> 
    <td width="10" height="10" style="height:10px !important"> 
     <img src="http://s3.amazonaws.com/meagain/images/templates/letterhead/corner_tl.gif" style="display:inline; padding: 0px; margin:0px" width="10px" height="10px"></td> 
    <td width="531" height="10" style="height:10px !important; background-color:#FFFFFF;"> 
     <img src="http://s3.amazonaws.com/meagain/images/templates/letterhead/spacer.gif" style="display:inline; padding: 0px; margin:0px" width="10px" height="10px"></td> 
    <td width="9" height="10" style="height:10px !important"> 
     <img src="http://s3.amazonaws.com/meagain/images/templates/letterhead/corner_tr.gif" style="display:inline; padding: 0px; margin:0px" width="9px" height="10px"></td> 
    </tr> 
</table> 

Tôi xin lỗi vì có quá nhiều thuộc tính thừa, vì tôi đã thử mọi thứ. Về cơ bản, tôi đang cố gắng làm cho bảng chính xác cao 10px. Dù thế nào đi chăng nữa, GMail làm cho nó cao tới 16px. Nếu tôi sử dụng công cụ nhà phát triển để xóa tất cả ba hình ảnh trực tiếp từ mã nguồn, thì bảng thu gọn thành 10px. Ngoài ra, nếu tôi xóa 2 trong số ba hình ảnh, nó vẫn giữ nguyên 16px. Nó gần như là nếu TD phải là 16px nếu nó có chứa một hình ảnh, hoặc hình ảnh có 3px đệm xung quanh nó.

Có ai đã trải nghiệm bất cứ điều gì như thế này không? Và nếu có, bất kỳ ý tưởng nào? Tôi đang chạy ra khỏi ý tưởng, và sự tỉnh táo ..

+1

Chúng tôi có thể nhận thêm ngữ cảnh về điều này không? Làm thế nào và ở đâu là điều này xảy ra? Tại gmail.com bạn đang tự động chèn mã bảng ở đâu? Hoặc bạn đang chỉnh sửa một bảng hiện có? Điều này là thông qua Tiện ích mở rộng của Chrome? – mrtsherman

Trả lời

10

Giống như Herbie đã nói, hãy đảm bảo bạn đặt chiều cao dòng trên TD.

Cũng đảm bảo bạn có bộ kích thước phông chữ vì gmail có thể đặt chiều cao tối thiểu của TD dựa trên ký tự khoảng trắng trong ô đó. Nói chung, thiết lập kích thước phông chữ là 1px trong các ô không có văn bản nào là thực hành tốt.

Dường như đây là để tạo email html, đúng không? Hãy xem xét vấn đề này cho bất kỳ vấn đề nào khác - nó đã giúp tôi nhiều lần http://www.emailology.org/#1http://www.campaignmonitor.com/resources/ để biết các mẹo.

+0

Chúng tôi có một người chiến thắng! Cảm ơn Juan - Tôi thậm chí còn không nghĩ về chiều cao dòng. Hy vọng tóc của tôi sẽ sớm tái sinh .. – Anthony

4

Tôi không thể bình luận được nêu ra, vì vậy tôi sẽ đăng như một câu trả lời ...

16px âm thanh như một giá trị line-height. Bạn đã cố gắng thiết lập chiều cao dòng của mỗi TD đến 10px hoặc thay đổi mỗi IMG từ nội tuyến thành inline-block?

3

Tôi đã cố gắng tìm ra giải pháp của bạn.

Đây là giải pháp theo nghĩa đen, đặt điều này trong thẻ TD của bạn:

style="line-height:0" 
2

Trong thẻ <img> của bạn, bạn có thể đặt này:

style="display:block;" 

... hoặc bạn có thể làm cho chiều cao đến max-height. Nó sẽ giải quyết vấn đề của bạn.

0

Trong html - <img> thẻ không phải là một thẻ block vì vậy chúng tôi cần phải sử dụng css sau đây để cho nó hoạt động như một thẻ khối

style="display:block;" 

với điều này CSS chiều cao cho bạn sẽ hoàn toàn làm việc trên trang HTML của bạn .

Hãy thử một lần!

Các vấn đề liên quan