0

Hey guys, I need a little help on the site I'm working on . I'm trying to move the two images so they are side by side to the right of the navigation menu, like this. I've tried using floats on the divs responsible for the pictures and the list where the menu resides, but to no avail. Im using a 12 column in 960 grid system. This (http://pastebin.com/nfrctRhS) is the CSS code for the page. I really appreciate any help you guys can offer, as I've been stuck on this problem for quite a while. Thanks!

moonkin
  • 3
  • 1
  • Did you get it working already? as in my browser it seems to be aligned side by side. But there is lot of mis-alignment in terms of upper
    tag and the div#main. I would recomment not to use header tag(HTML5) as it is not supported by all browsers. Use a centering wrapper to contain all elements of body. That will fix the alignment of the page
     – samarjit samanta Mar 15 '11 at 02:02

2 Answers2

0

if you take off your images of the div #featured and add 

#featured {
    width:100px;
    float:left;  
}

?

GG.
  • 21,083
  • 14
  • 84
  • 130
  • What do you mean by "take off your images of the div #featured"? Like move the images out of that div and into the parent – moonkin Mar 13 '11 at 20:32
  • oops sorry for my bad english. Yes move images after like and add the css that i wrote – GG. Mar 13 '11 at 20:36
  • Okay, I did what you said and deployed it on the site. As you can see (http://goo.gl/EmO0o), nothing really changed except the width of the menu. For some reason, it looks like the float has no effect. – moonkin Mar 13 '11 at 21:06
0

Your main problem is nav has a padding-right:800px; This means there is not room within the nav div for them to fit.

set 

header nav { padding-right:0px; }

for the desired result.

Gary Corbett
  • 139
  • 4