1 Replies - 837 Views - Last Post: 23 January 2013 - 06:31 PM

#1 ronanbrowne88  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 25
  • Joined: 21-November 12

Keeping horizontal navigation bar unaffected by screen resolution

Posted 23 January 2013 - 03:53 PM

ok i have a fixed position horizontal navigation bar in my header, i want to have it so when the screen resolution is changed it doesn't change layout, currently if i bring resolution below a certain point, the slots will start going vertical.
how do i stop this from happening and keep my web site layout even though resolution is being shrank. its fine untill baout 1200 x 720

relevant html and css below

		<div id = "header"   >
			<h1 style = "margin-bottom:0;color:yellow" > title</h1>
			<div class="slot"><a href ="index.html">title</a>
			</div>
			<div class="slot"><a href ="link5.html">title</a>
			</div>
			<div class="slot"><a href ="link4.html"> title</a>
			</div>
			<div class="slot"><a href ="link3.html">title</a>
			</div>
			<div class="slot"><a href ="link2.html">title </a>
			</div>
			<div class="slot"><a href ="link1.html">title</a>
			</div> <!--End of navigation div -->
		</div><!--End of header div -->



related css

.slot {
	width:160.5px;
	height:36px;
	margin:0 auto;
	float:left;
	border:2px solid #A60303 ;
	background-color:#faf8cb;
	color:black;
	margin-bottom:3px;
}

#wrapper {
	width:987px;
	margin: 0 auto;
	
	
}

#header{
	background:#A60303;
	color:#F2B705;
	text-align:center;
	position:fixed;
	z-index:2;
    	top:0;
	margin:0px;
    	padding:0px;
}



Is This A Good Question/Topic? 0
  • +

Replies To: Keeping horizontal navigation bar unaffected by screen resolution

#2 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3219
  • View blog
  • Posts: 10,791
  • Joined: 12-December 12

Re: Keeping horizontal navigation bar unaffected by screen resolution

Posted 23 January 2013 - 06:31 PM

Set a width for #header and/or a min-width.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1