Vertical-align thuộc tính CSS không hiển thị đúng trên trình duyệt Chrome

Thảo luận trong 'Ngôn ngữ lập trình CSS, HTML, HTML5' bắt đầu bởi seolagi, 14/11/18.

  1. seolagi
    Tham gia ngày:
    16/4/14
    Bài viết:
    1,024
    Đã được thích:
    80
    Điểm thành tích:
    48
    Thuộc tính vertical-align: middle; của mình trong thẻ div css class nó hiển thị không đúng trên trình duyệt web chrome, trong khi nó hiển thị hoạt động đúng trên trình duyệt web firefox mới bực chứ.

    Bạn nào biết giúp mình với làm sao cho nó hiển thị đúng trên cả 2 trình duyệt với thuộc tính vertical-align: middle giúp mình với.

    Code css
    HTML:
    .login
    {
       width: 100%;
       height: 55px;
    }
    .login .loginnull {
        vertical-align: middle;
        text-align: center;
    }
    
    Code HTML
    HTML:
    <div class="login">
       <div class="loginnull">
          <a href="#">Login / Register </a>
      </div>
    </div>
    
    Khi chạy trên Firefox thì nó hiển thị đẹp theo ý như code.

    vertical-align-middle-hien-thi-dung-tren-firefox.jpg

    Khi chạy web trên Chrome thì nó lại hiển thị sai, không hiển thị đúng như trên firefox

    vertical-align-middle-hien-thi-sai-tren-chrome.jpg
     
    Cảm ơn đã xem bài:

    Vertical-align thuộc tính CSS không hiển thị đúng trên trình duyệt Chrome

  2. admin
    Tham gia ngày:
    22/5/13
    Bài viết:
    4,878
    Đã được thích:
    1,193
    Điểm thành tích:
    113
    Giới tính:
    Nam
    Bạn phải thêm thuộc tính display đúng cho 2 thẻ thì mới hiển thị đúng bạn nhé. Bạn sửa lại css như sau nhé:
    HTML:
    .login
    {
       width: 100%;
       height: 55px;
       display: table;
    }
    .login .loginnull {
        vertical-align: middle;
        text-align: center;
        display: table-cell;
    }
    
     
    seolagi thích bài này.
  3. seolagi
    Tham gia ngày:
    16/4/14
    Bài viết:
    1,024
    Đã được thích:
    80
    Điểm thành tích:
    48
    Cảm ơn ad, đúng cái mình cần, mình đã làm được như ad chỉ rùi
     


Chủ để tương tự : Vertical-align thuộc
Diễn đàn Tiêu đề Date
Ngôn ngữ lập trình CSS, HTML, HTML5 Thuộc tính attribute rel trong html là gì? 25/11/23
Ngôn ngữ lập trình CSS, HTML, HTML5 Xin kích thước tất cả các size của youtube video channel? 23/11/20
Ngôn ngữ lập trình CSS, HTML, HTML5 [Hỏi] Khoảng cách chữ text trong html css là thuộc tính gì ấy nhỉ? 1/9/20
Ngôn ngữ lập trình CSS, HTML, HTML5 Thuộc tính khoảng cách text, khoảng cách chữ trong html css là gì? 30/6/20
Ngôn ngữ lập trình CSS, HTML, HTML5 Chỉnh kích thước set size Width Height CKEDITOR như thế nào? 15/4/20