-
Posts
-
Hi guys,
1. I was wondering if it’s possible to make the navigation justify to the right if I’m using the “Header with social icons bottom navigation” ?
2. Is there a way to make to modify the CSS so it’s a header fixed with this Header style?
3. How can I make the social icons a couple of px bigger?. Is there an easy code I can insert the social icons into the footer as well?
Thank you!!
Hi,
1.) You can use this
#top .main_menu .menu li {
float: right;
}2.) To make the header fixed, you use this
#header {
position: fixed;
}
#main {
padding-top: 155px;
}3.) You increase the icon size with this
.social_bookmarks .avia-font-entypo-fontello {
font-size: 16px;
}Regards,
Ismael
That’s very helpful Ismael. THANK YOU!!! Couldn’t figure that stuff out.
By any chance do you if it’s possible to make the light gray lines between menu items shrink to approximately the height of the text?
here’s an example of what I’m talking about: http://cl.ly/image/0Z2I2W442q2b
Thank you again!
– John
Hi,
Your link is dead.
http://www.clipular.com/c?5676122=5jLI2E7Bmphfva-j22vHx9RKtLQ&f=.png
Thanks,
Nick
Hi,
You always find the not so easy ones, lol.
Well, its possible of course, but would require the menu to be changed in multiple ways. Right now the css below controls those vertical lines and as you can see its a border.
I added the very last one border-image, and you can see how it looks so without having to rebuild the menu, I think something like this would be the best solution, so you would need to create an image of a border and then plug it in there. Obviously the image i am using is not going to work out well. You can see for yourself though. http://www.clipular.com/c?5895319=Qkr65KYgSXgHdJ3pSJKi-_W2TIY&f=.png
Don’t mind for now that it affects the sub menus, the css can be targeted better, but first need that border image.
/*only the vertical line for very first menu item*/
#top .main_menu ul:first-child>li:first-child a {
border-left-style: solid;
border-left-width: 1px;
border-color: rgb(225, 225, 225);
}
#top .main_menu ul:first-child>li a {
border-right-style: solid;
border-right-width: 1px;
border-color: rgb(225, 225, 225);
/*
*/
-moz-border-image: url(https://www.w3.org/TR/css3-background/border.png) 1 6 56 27 stretch;
-webkit-border-image: url(https://www.w3.org/TR/css3-background/border.png) 1 6 56 27 stretch;
-o-border-image: url(https://www.w3.org/TR/css3-background/border.png) 1 6 56 27 stretch;
border-image: url(https://www.w3.org/TR/css3-background/border.png) 1 6 56 27 stretch;
/*
*/
}Of course if you want to try on for size something easier, like changing ”solid” style to dashed, or dotted. Otherwise border image is the way to go, There are a number of generators that can help you along, once you have your image ready. like this one http://border-image.com/
Thanks,
Nick
Nick,
Thank you very much. That’s an interesting approach. You went well above duty on that one. I didn’t realize it was so difficult to adjust. I thought it was just the height of the padding and right frame set to 1 px. I’ll dive deeper and try and find something that looks great using a border image using your suggestions.
If you can think of any other tough questions I should ask, just let me know :)
Cheers,
– John
- The topic ‘Possible to right justify the menu when it's below the logo?’ is closed to new replies.