2 Replies - 324 Views - Last Post: 10 July 2012 - 06:09 AM

#1 nick2price  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 562
  • View blog
  • Posts: 2,826
  • Joined: 23-November 07

pseudo elements

Posted 10 July 2012 - 02:04 AM

Hi guys. I have added a menu to my site using a Wordpress plugin. When I add a border, it messes the menu up because it increases the width of the columns, and they no longer fit on the one line. I spoke to the developer, and he advised that I used pseudo elements to draw my dividers. At the moment I have
#nav_menu-3,
#nav_menu-4,
#nav_menu-5,
#nav_menu-6,
#text-7,
#text-12{
	border-left:1px solid #4E4E64!important;
}


Does anyone know what he means to use pseudo elements to draw my dividers? I did try the following without success
#nav_menu-3:before,
#nav_menu-4:before,
#nav_menu-5:before,
#nav_menu-6:before,
#text-7:before,
#text-12:before{
	border-left:1px solid #4E4E64!important;
}


Cheers

Nick

Is This A Good Question/Topic? 0
  • +

Replies To: pseudo elements

#2 ahmad_511  Icon User is offline

  • MSX
  • member icon

Reputation: 131
  • View blog
  • Posts: 722
  • Joined: 28-April 07

Re: pseudo elements

Posted 10 July 2012 - 04:18 AM

Hi,
the pseudo you added must is applicable in presence of the content property and it's used to insert contents before targeted element
something like this
p:before{
    content:"Try to ";
    color:red;
}



<p>read carefully</p>
<p>understand why you do this</p>



applying this will insert "Try to " string before the content of each P element and in red

so, I'm not sure if the developer meant to use this pseudo in specific
posting the html and related css will give us a better view about the menu structure so we can see how the css should be adjusted to achieve required result

anyway, if the border is what messes the menu up, try to use outline property instead as it will not occupy a space (but depending on your current style it maybe not work for you)
Was This Post Helpful? 1
  • +
  • -

#3 Lazy Vulpes  Icon User is offline

  • D.I.C Head

Reputation: 3
  • View blog
  • Posts: 60
  • Joined: 02-May 12

Re: pseudo elements

Posted 10 July 2012 - 06:09 AM

You can also use a border and give it a negative padding equal to the border width.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1