?
Solved

CSS Problem

Posted on 2013-02-07
17
Medium Priority
?
215 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
 
LVL 6

Expert Comment

by:nickinthooz
ID: 38866550
I don't see any nav at all?
0
What Kind of Coding Program is Right for You?

There are many ways to learn to code these days. From coding bootcamps like Flatiron School to online courses to totally free beginner resources. The best way to learn to code depends on many factors, but the most important one is you. See what course is best for you.

 

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
 

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 2000 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

What Kind of Coding Program is Right for You?

There are many ways to learn to code these days. From coding bootcamps like Flatiron School to online courses to totally free beginner resources. The best way to learn to code depends on many factors, but the most important one is you. See what course is best for you.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
Q&A with Course Creator, Mark Lassoff, on the importance of HTML5 in the career of a modern-day developer.
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …

579 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