- This topic is empty.
-
AuthorPosts
-
March 7, 2013 at 9:09 pm #43227shemademagicMember
Hey guys,
This is the website I’m working on at the moment ( & obiviously my first ) :
[Gardening Website](http://eleanorgallahergardening.co.uk/home.html “http://eleanorgallahergardening.co.uk/home.html”)
FIRSTLY – MAJOR issue – horizontal navigation with a logo in the center looks okay in all browsers, except IE 9 – I have tried everything and I can’t seem to fix it. I need it to be centered and horizontally aligned. Ideally manage to even the white space between li’s as it renders in Chrome. It’s killing me and I really need to finish the website asap.
This is the CSS for it:
/* Navigation */
ul#nav1 {
display: inline-block;
}ul#nav1 li{
display: inline-block;
padding-right: 15px;
text-align: left;
margin-left: -15px;
}#logo {
display:inline-block;
margin: 0 auto;
padding-top:10px;
margin-bottom: -10px;
}ul#nav2 {
display: inline-block;
margin-right: -13px;
}ul#nav2 li{
display: inline-block;
text-align: right;
padding: 5px;
}a {
text-decoration: none;
color: black;
}/* Dotted Underline Images*/
#homedots{
display:block;
margin-top: 5px;
margin-left: -40px;
}#servicesdots{
display:block;
margin-top: 5px;
}#portfoliodots{
display:block;
margin-top: 5px;
}#contactdots{
display:block;
margin-top: 5px;
}
/* End of Dotted Underline Images*/SECONDLY All content in IE 9 appears in italics????? I have not specified font-style in body, only for certain elements. Does anyone know how to fix it?
I would really appreciate some help!
Thank you
March 7, 2013 at 9:45 pm #127398wolfcry911Participantor use floats…
http://codepen.io/wolfcry911/full/lFLvHI took the liberty of redoing the page. You’ve used far too many ids and classes. My markup could use even further refining, but I just wanted to quickly show how this could be done.
March 8, 2013 at 4:33 am #127418shemademagicMemberThank you @wolfcry911, much appreciated. I’ll try it out.
March 8, 2013 at 6:46 am #127440shemademagicMemberHey @wolfcry911 , everything looks great but I don’t really get how this code :
#footer {
margin: 15px 0;
background: #88AF3C;
clear: both;
overflow: hidden;
}#footer>div {
float: left;
font-size: 16px;
line-height: 22px;
color: #4E4442;
margin: 0 10px 0 20px;
}#footer h3 {
border-bottom: 1px solid #D1E889;
color: #FFF;
font-size: 17px;
text-transform: uppercase;
}actually aligns the footer on the left. I tried doing it but it doesn’t come out like yours?
– [This page](http://eleanorgallahergardening.co.uk/home.html “”)
March 8, 2013 at 6:51 am #127441wolfcry911Participantyou’ve got a few errors – you’re missing the closing div tag for the #sidebar, which then places the footer within it. The .testimonial div is missing a bracket, and a break tag in the header is malformed.
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.