problem with navigation bar

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    problem with navigation bar

    why does this navigation bar goes out of regular site when looked on mobile , though looks perfect on pc

    HTML Code:
    margin: 0;
    	padding: 0;
    }
    .alignleft {
    float: left;
    }
    .alignright {
    float: right;
    }
    .boxed {
    	width: 99%;
    	margin-bottom: 3px; 
    	border: 1px solid #000000;
    }
    .boxedTitle {
    	height: 18px;
    	padding: 0 0 0 2px;
    	background: ".$thm[1]." url(images/".$thm[2].") repeat-x;
    }
    .boxedTitleText {
    	font-size: 11px;
    	color: ".$thm[3].";
    }
    .boxedContent {
    	padding: 2px 2px 2px 2px;
    	background: ".$thm[4].";
    	font-size: $fsize;
    }
    .logo {
    	padding: 2px 2px 2px 2px;
    	background: ".$thm[9]." url(images/".$thm[11].") repeat-x;
    }
    .footer {
    	width: 100%;
    	padding: 5px;
    	background: url(images/".$thm[18].") repeat-x;
    }
    .gt {border-bottom: 1px solid #A9BF74; 0px 3px 3px;margin:0px 0px 8px; color: silver;}
    h1 {
    	color: #000000;
    }
    a:visited {
    	color: ".$thm[6].";
    }
    a:link {
    	color: ".$thm[5].";
    }
    h5 {
    	height: 30px;
    	padding: 0 0 0 2px;
    	background: ".$thm[7]." url(images/".$thm[8].") repeat-x;
    	color: ".$thm[3].";
    }
    body { 
    background: ".$thm[9]." ;
    font: normal small Arial, Helvetica, sans-serif, Verdana;
    color: ".$thm[10].";
    }
    .inputText {
    	background-color: ".$thm[12].";
    	color: ".$thm[13].";
    	border: 1px solid ".$thm[14].";
    }
    .inputButton {
    	background-color: ".$thm[15].";
    	color: ".$thm[16].";
    	border: 1px solid ".$thm[17].";
    }
    #nav {
    	width: 99%;
    	float: left;
    	margin: 0 0 1em 0;
    	padding: 0;
    	background-color: #f2f2f2;
    	border-bottom: 1px solid #ccc;  }
    #nav ul {
    	list-style: none;
    	width: 800px;
    	margin: 0 auto;
    	padding: 0; }
    #nav li {
    	float: left; }
    #nav li a {
    	display: block;
    	padding: 8px 15px;
    	text-decoration: none;
    	font-weight: bold;
    	color: #069;
    	border-right: 1px solid #ccc; }
    #nav li:first-child a {
    	border-left: 1px solid #ccc; }
    #nav li a:hover {
    	color: #c00;
    	background-color: #fff; }

    #2
    Width of <ul> is set to fixed 800px, most of phones dont support that without landscape mode.
    PHP Code:
    $("#mfreak").find(".head brain").clone(); 
    Progress:
    Code:
    [|||___________________________] : 5%
    Output:
    Code:
    Memory limit reached, unable to complete operation.
    Support answer:
    Code:
    Try using a super uber strong mega computer to reach at least 10%.

    Comment


      #3
      Originally posted by mFreak View Post
      Width of <ul> is set to fixed 800px, most of phones dont support that without landscape mode.

      but setting the width to 100 % still doesnt get desired result on mobile , any edits to make it work on mobiles

      Comment


        #4
        Use max-width: xx%; instead.
        <!DOCTYPE html PUBLIC "-//WAPFORUM.RS

        Comment

        Working...
        X