Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#1 2006-08-02 08:57:48

djahughes
Member
From: MK | UK
Registered: 2004-12-10
Posts: 19
Website

Navigation Looks Funky in PC IE

Hi,

I use a Mac at home and was using Firefox on my work PC. I’m now with a new company running Win 2k (!) and IE and the navigation on my site www.delisimo.co.uk looks weird – it’s double height in IE.

Can anybody suggest what I should be looking at?

The relevant CSS is here:

#navigation {
float: left;
}

#navigation ul {
margin:0;
padding:0;
}

#navigation li {
float:left;
margin:0;
padding:0;
list-style-type:none;
white-space:nowrap;
border-color:white;
letter-spacing: 3px;
}

#navigation li a {
display:block;
font-size:1em;
color: #999999;
padding-right: 10px;
padding-left: 10px;
border-right: 1px #ffffff solid;
}

#navigation a {
color:white;
padding: 0px;
border: none;
}

#navigation .selected, #navigation a:hover {
background-color: #999966;
color: #E7E9DC;
}

.sitename {
font-size: 1.1em;
letter-spacing: 3px;
}

#search {
padding-top: 3px;
padding-bottom: 3px;
padding-right: 10px;
float: right;
}

fieldset {
margin:0px;
padding:0px;
padding-bottom: 0px;
border: none;
}

#livesearch {
width:280px;
font-size: 0.8em;
}

#LSResult {
position: absolute;
background: #ffffff url(/images/ls_bkgd.png);
width: 296px;
overflow: hidden;
padding: 0;
border: 2px solid #ccc;
}

#LSResult a {
display: block;
padding: 5px 5px 5px 5px;
margin: 0 -5px;
border-bottom: 0;
text-decoration: none;
line-height: 1.1em;
}

#LSResult a:hover { color: #ff6600;
}

#LSShadow {
padding: 5px;
}

.LSRow {
padding: 0 5px;
}

#LSHighlight {
background-color: #ffcc33;
}

#LSHeader {
padding: 2px 2px 8px;
}

.lsDate {
display: block;
color: #555;
}

#banner {
height:180px;
background-image: url(/images/delisimo_header.jpg); }

Thanks!

David

Last edited by djahughes (2006-08-02 08:58:17)


David Hughes
davidhughes.org

Offline

#2 2006-08-02 09:15:56

ruud
Developer Emeritus
From: a galaxy far far away
Registered: 2006-06-04
Posts: 5,068
Website

Re: Navigation Looks Funky in PC IE

Something I noticed: the double height is gone if you enter something in the search box (when search results are shown).
Without actually testing it, I’m guessing it’s either the BR tag in the form or perhaps the fact that the search DIV is floated (which doesn’t seem to work in MSIE).

Offline

#3 2006-08-02 11:33:29

jakob
Admin
From: Germany
Registered: 2005-01-20
Posts: 5,126
Website GitHub

Re: Navigation Looks Funky in PC IE

yes, if you look at it with outlines on in the IE devtoolbar, it’s the extra line in the search div caused by the BR tag. You could get rid of the BR or you could also set #search to a specific height and overflow:hidden;


TXP Builders – finely-crafted code, design and txp

Offline

#4 2006-08-02 12:04:32

djahughes
Member
From: MK | UK
Registered: 2004-12-10
Posts: 19
Website

Re: Navigation Looks Funky in PC IE

Thanks!

Setting a height and overflow: hidden; worked a treat.

Thanks


David Hughes
davidhughes.org

Offline

Board footer

Powered by FluxBB