1. Trang chủ
  2. Câu hỏi và trả lời
  3. không thể loại bỏ thanh cuộn ngang trên trang web của tôi

không thể loại bỏ thanh cuộn ngang trên trang web của tôi

2010-10-04 39 views

Trả lời

20

Di width:100% từ ba yếu tố chính của bạn.

Bằng cách thêm width: 100%, bạn buộc khu vực khách hàng của từng yếu tố lấp đầy trình duyệt.
Vì đường viền của các phần tử thêm một điểm ảnh bổ sung ở mỗi bên, bạn kết thúc bằng một thanh cuộn.

Nguồn

2010-10-04 13:53:52 SLaks

+2

theo mặc định, div là yếu tố cấp khối sẽ lấp đầy 100% không gian có thể (theo chiều ngang), do đó bạn không bao giờ thực sự cần phải chỉ định chiều rộng 100% – jimplode

4

Làm cho nội dung của bạn vừa khít trong cửa sổ.

hoặc

<body scroll="no" style="overflow: hidden">

Nguồn

2010-10-04 13:53:24 jimplode

+2

Điều gì sẽ xảy ra nếu cửa sổ nhỏ hơn nội dung? Làm thế nào người ta di chuyển để xem nội dung ẩn? – aldux

3

Đây là đường viền 1px của bạn. Bạn đã đặt chiều rộng thành phần chính thành 100% sau đó thêm đường viền 1px xung quanh các đối tượng

Nguồn

2010-10-04 13:56:10

+2

Đó là những thứ như thế này mà tôi luôn thấy phiền phức về CSS cho phép bạn chỉ định các biểu thức như "100% -4px". – Spudley

+0

@Spudley Trên thực tế, bạn có thể. 'width: calc (100% - 4px);' – frederick99

+0

@ frederick99 - cảm ơn nhận xét. 'calc()' không có sẵn trong năm 2010 khi tôi nhận xét; nó thậm chí không có trong đường ống. Đó là một phước lành thực sự để có nó trong CSS ngày hôm nay, và tôi sử dụng nó rất nhiều (mặc dù tôi vẫn thấy tôi phải cẩn thận với nó bởi vì nó phá vỡ trình duyệt cũ). Lưu ý rằng 'box-sizing: border-box' có lẽ sẽ là một giải pháp tốt cho vấn đề ban đầu ở đây, nhưng đó cũng không phải là một lựa chọn tại thời điểm đó. Mọi thứ đã chuyển sang, cảm ơn lòng tốt. – Spudley

2

Phần tử #top-wrapper có đường viền 100% và 1px (trái và phải) tính tổng cộng 100% + 2px (2px nữa có sẵn) để thanh cuộn xuất hiện. Giải pháp được đề xuất (không phải là giải pháp!) Không phải để thêm width:100%; cho các thành phần mà bạn muốn chiếm toàn bộ chiều rộng của bố mẹ tương ứng, nhưng hãy để trình duyệt xử lý điều đó.

Hộp nổi là ngoại lệ đối với đề xuất này và chúng cần được xử lý khác nhau. Để biết thêm thông tin bạn có thể xem tại đây http://www.w3.org/TR/CSS2/box.html

Hy vọng điều này trả lời câu hỏi của bạn, Alin

Nguồn

2010-10-04 14:07:16

1

Trong trường hợp của tôi, đó là một nhỏ <div> với một vị trí tương đối của left: 690px khiến các trình duyệt thêm khoảng cách ngang (và các thanh cuộn).

#feedbackButton { 
     position: relative; 
     height: 0; 
     top: -46px; 
     left: 790px; 
}

Tôi đã thay đổi điều này thành float: left và sự cố đã được giải quyết.

Nguồn

2012-02-17 09:20:11 Timo

0

<body style="overflow-x: hidden;">

Đủ rồi. Bạn chỉ có thể sử dụng

overflow-x: hidden;

trên thẻ body.

Nguồn

2018-03-07 19:40:32 VikasGaurav

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

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