2013-11-10 4 views
-4

(Нет ответов не работал еще, пожалуйста, продолжайте отвечать)CSS/HTML Ширина страницы

http://gyazo.com/952d354b05e4a4a4cef08e74f8b0253d

http://gyazo.com/e8cc5ae0bcd0464eb074c4674d2896fb

Как вы можете видеть из этих изображений, я создал Navbar для моего сайт, но мой веб-сайт слишком широк, это означает, что вам нужно прокрутить его до конца, как бы изменить ширину, чтобы она приближалась только до конца навигационной панели?

Это все мои CSS для навигационной панели, которые я использовал:

#title { 
    position:relative; 
    margin:17px 1680px 30px 15px; 
     } 
     #banner { 
    border:1px solid #4A4A4A; 
    width:1903; 
    height:110; 
    background-color:#4A4A4A; 
    margin-left:0px; 
    position:absolute; 
    top:-10px; 
    border-radius:15px; 
     } 
     #navbar { 
    position:fixed; 
    left:50%; 
    margin-top:2px; 

     } 
     ul { 
    list-style-type:none; 
    margin:-115px; 
     } 
     li {  
    display:inline; 
    padding:9px; 
    border:4px solid; 
    font-family:Bebas; 
    font-size:25px; 
    font-weight:bold; 
    color:#FFFFFF; 
    border-radius:10px; 
    background-color:#000000; 
    margin-left:2.5em; 
     } 

Это мой HTML-код как хорошо:

<html> 

    <head> 
    <link type="text/css" rel="stylesheet" href="todd.css"/> 
    <title>Home</title> 

    </head> 

    <body bgcolor="#ABABAB"> 
<div> 
    <div id="banner"> 
    <a href="file:///C:/Users/Todd/Desktop/todd.html"><img   src="file:///C:/Users/Todd/Desktop/Todd.png" id="title"></a> 
     <div id="navbar">   
     <ul> 
      <a href="file:///C:/Users/Todd/Desktop/todd.html"><li>Home</li></a>      
      <li>Not Finished</li>      
      <li>Not Finished</li>      
      <li>Not Finished</li>   
     <ul> 
     </div>    
    </img> 
    </div> 
     </div> 
     </body> 



    </html> 
+0

Добро пожаловать на ТАК! Если вы поместите соответствующий код в [jsFiddle] (http://jsfiddle.net/), людям будет легче увидеть проблему и исправить ее. – ASGM

+1

попробуйте эту ширину: 1903; height: 110; 'to' width: 100%; height: 110px; ' –

+1

Возможный дубликат [Ширина моего веб-сайта нуждается в изменении] (http://stackoverflow.com/questions/19889458/width-of-my-website-needs-changing) – Doorknob

ответ

0

Пару вещей, которые я вижу здесь ...

Ваш навигатор имеет следующую строку:

width:1903; 

Если вы не хотите, чтобы навигатор был настолько широким, вы должны сжиматься таким образом.

Кроме того, если вы хотите сохранить сайт от расширения настолько широки, вы можете также задать ширину для html и body тегов, например, так:

html, body {width: 1024px} 

Надеется, что помогает ...

EDIT

На второй взгляд, я вижу, ваша маржа также устанавливается очень широка здесь:

margin:17px 1680px 30px 15px; 

Сокращение 1680 вниз приведет к тому, что стержень будет расширяться настолько широко. Это, по-видимому, является основной причиной того, что ваш заголовок загорается настолько широко.

0

При использовании мин-ширина размер страницы должны свести к минимуму, чтобы соответствовать все содержимое в.

#banner { 
    min-width: 1903px; 
} 
Смежные вопросы