Tycoon Talk
Become a Big fish!
The number 1 forum for online business!
Post topics, ask questions, share your knowledge.
Tycoon Talk is part of Freelancer.com - find skilled workers online at a fraction of the cost.

CSS Forum


You are currently viewing our CSS Forum as a guest. Please register to participate.
Login



Reply
Help with how my plain text navigation shows up in different browsers
Old 03-12-2009, 08:55 PM Help with how my plain text navigation shows up in different browsers
Experienced Talker

Posts: 46
Name: Jack
Trades: 0
Hello i am new to the forum and can't wait to read other posts. I have an issue with a template im designing for my website. The plain text navigation is exactly 7px from the header and the content underneath in FireFox but it changes differently in IE Safari and Google chrome.

I would like it to be the same as it is in Firefox for all browsers.

Thanks allot for any help, here is my css code. Page is in my sig

Code:
#shoplinks {
    width: 200px;
    height: 21px;
    color: #8595a2;
    font-size: 10px;
    font-family: tahoma;
}

#container {
    width: 920px;
}
#header {
    height: 170px;
    width: 920px;
    background-image: url(images/big_palm.jpg);
}

#topnav
{
    position: relative;
    font-weight: bold;
    top: -5px;
    background-color: #FFFFFF;
}

#content {
    width: 556px;
    padding-top: 12px;
    padding-right: 10px;
    padding-bottom: 0px;
    padding-left: 10px;
    margin-right: 140px;
    margin-left: 203px;
}
#leftnav {
    float: left;
    width: 182px;
    height: 1480px;
    background-image: url(images/leftnavbar.jpg);
    padding: 10px;
}

#leftnav ul
{
    margin-left: 0;
    padding-left: 0;
    list-style-type: none;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}

#leftnav a
{
    display: block;
    width: 170px;
    padding-top: 3px;
    padding-right: 3px;
    padding-bottom: 3px;
    padding-left: 3px;
    border-bottom-width: 1px;
}

#leftnav a:link, .navlist a:visited
{
color: #ffffff;
text-decoration: underline;
font-weight: bold;
}

#leftnav a:visited
{
   color: #ffffff;
   text-decoration: underline;
   font-weight: bold;
}

#leftnav a:hover
{
    text-decoration: none;
    color: #0000ff;
}

#sidebar {
    padding: 10px;
    float: right;
    width: 120px;
    background-image: url(images/rightnav2.jpg);
    height: 1480px;
}

#footer {
    background-color: #bfcad0;
    padding: 10px;
    clear: both;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    position: relative;
    top: 5px;
}


h1 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 22px;
    font-weight: bold;
    color: #1A2373;
    line-height: 24px;
}
h2 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 17px;
    font-weight: bold;
    color: #2F77F1;
    line-height: 20px;
}
h3 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: bolder;
    color: #000000;
    line-height: 20px;
}

p {
    font-family: Tahoma, Geneva, sans-serif;
    font-size: 12px;
    line-height: 11pt;
    margin-top: 3px;
    margin-right: 0;
    margin-bottom: 3px;
    margin-left: 0;
    padding-bottom: 9px;
}

a {
    color: #8C9FB0;
    font-weight: bold;
    text-decoration: none;
}
a:visited {
    color: #8C9FB0;
    text-decoration: none;
    font-weight : bold;
}
a:hover {
    color: #E82525;
    text-decoration: none;
}

.smalltext {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    padding: 3px 0;
    margin: 3px 0;
    line-height: 12pt
}
#container #header #header {
    font-family: Verdana, Geneva, sans-serif;
}
#container #topnav a {
    height: 21px;
    width: 920;
    font-size: 10px;
    text-decoration: bold;
    padding: 0px 0px 5px 0px;

}
#shoplinks p a {
    font-size: 10px;
}
#container #topnav a {
    font-weight: bold;
}

.resize
{
    font-size: 10px;
    top: -1px;
    color: #E82525;
    font-weight: bold;
    font-family: Verdana, Geneva, sans-serif;
    
}
__________________

Please login or register to view this content. Registration is FREE


The best skateboarding video's, trick tip's and archives.
conceptskate is offline
Reply With Quote
View Public Profile Visit conceptskate's homepage!
 
 
Register now for full access!
Old 03-12-2009, 09:36 PM Re: Help with how my plain text navigation shows up in different browsers
chrishirst's Avatar
Missing! presumed drunk.

Posts: 41,517
Name: Chris Hirst
Location: Blackpool. UK
Trades: 0
Use a floated list instead of the bunch of divs and spans, and use a right border on the <li>s instead of all that extra code just to place a pipe symbol. Or you could float the <a>s instead and set a width and border on them.

fix the width/doubled margin issue with the centre content, it suffers from "float:drop"
__________________
Chris. ->> Links are advertising NOT optimising!! <<-
A foolish consistency is the hobgoblin of little minds
Thought for today:- I SEO the only industry where all the cowboys are Indians?
chrishirst is offline
Reply With Quote
View Public Profile Visit chrishirst's homepage!
 
Reply     « Reply to Help with how my plain text navigation shows up in different browsers
 

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off





   
RSS Feed  Feeds: RSS   JS   XML
RSS Feed  Feeds for this forum: RSS   JS   XML



Page generated in 0.18199 seconds with 12 queries