Solved

CSS Problem

Posted on 2013-02-07
17
206 Views
Last Modified: 2013-02-07
I have a web design and am having trouble getting a couple things to go all the way across.

The item in question is the nav class. I am stumped. Please help.
index-plain.php
core2.css
0
Comment
Question by:katlees
  • 9
  • 8
17 Comments
 
LVL 6

Expert Comment

by:nickinthooz
ID: 38866414
can you post your site or the images for the nav and logo so I can see it all.
0
 

Author Comment

by:katlees
ID: 38866533
0
 
LVL 6

Expert Comment

by:nickinthooz
ID: 38866550
I don't see any nav at all?
0
Gigs: Get Your Project Delivered by an Expert

Select from freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely and get projects done right.

 

Author Comment

by:katlees
ID: 38866554
I took it out to get the issue with the red bar correct.
0
 
LVL 6

Expert Comment

by:nickinthooz
ID: 38866556
maybe I'm not understanding your problem?
0
 

Author Comment

by:katlees
ID: 38866557
http://www.northamericantribal.com/TeST/

is the one with the nav and content in it
0
 

Author Comment

by:katlees
ID: 38866558
The red nav line needs to go all the way across. If I pull it up on an IPAD or a small screen size, it stops at 930 px
0
 
LVL 6

Expert Comment

by:nickinthooz
ID: 38866576
try this:

<div class="nav-main" style="width:100%;">

Open in new window


I see your problem with my phone, on the browser it's fine.
0
 

Author Comment

by:katlees
ID: 38866582
Not working on my ipad
0
 
LVL 6

Expert Comment

by:nickinthooz
ID: 38866585
or try adding this in css:

{
  width: 100%;
  margin: 0px;
}

Open in new window


or

margin-right:-10px;
margin-left:-10px;

Open in new window

0
 
LVL 6

Expert Comment

by:nickinthooz
ID: 38866588
0
 

Author Comment

by:katlees
ID: 38866589
my nav-main looks like this in CSS now

.nav-main{

 background-image:url(../site_images/nav-bckgrnd.png);
background-position:top center;
background-repeat:repeat-x;
width:100%;
height:73px;
position:relative;
z-index:2;
margin-right:-10px;
margin-left:-10px;

}
0
 

Author Comment

by:katlees
ID: 38866592
Still not working..
0
 
LVL 6

Expert Comment

by:nickinthooz
ID: 38866594
here, this works:

apply min-width:1024px, or even just min-width:1000px
0
 

Author Comment

by:katlees
ID: 38866598
I have this and it isn't working..

.nav-main{
 background-image:url(../site_images/nav-bckgrnd.png);
background-position:top center;
background-repeat:repeat-x;
height:73px;
position:relative;
z-index:2;
min-width:1024px;

}
0
 
LVL 6

Expert Comment

by:nickinthooz
ID: 38866599
this also:

<meta name="viewport" content="width=1003, initial-scale=1, maximum-scale=1">

Open in new window


goes in the header
0
 
LVL 6

Accepted Solution

by:
nickinthooz earned 500 total points
ID: 38866606
I'm sorry, apply the min-width to your <body> tag

<body style="min-width: 1024px;">

Open in new window

0

Featured Post

Live: Real-Time Solutions, Start Here

Receive instant 1:1 support from technology experts, using our real-time conversation and whiteboard interface. Your first 5 minutes are always free.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Have you tried to learn about Unicode, UTF-8, and multibyte text encoding and all the articles are just too "academic" or too technical? This article aims to make the whole topic easy for just about anyone to understand.
Why do we like using grid based layouts in website design? Let's look at the live examples of websites and compare them to grid based WordPress themes.
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

776 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question