custom menu a{ width

Link to the site please.

formatting in WordPress is no different from other web page programming –

you identify the css selector of the elements (for example try to use a browser inspection tool, such as Firebug or Firefox’ web developer add-on), and apply some styles.

Site is currently running on xampp, so that won′t be possible. Can prtsrc help a little?

https://i1278.photobucket.com/albums/y513/bastovic/custom_menu_zps43fb8173.png

this might help: https://getfirebug.com/

as I mentioned already, this is a general formatting issue and not specific to WordPress.

i′m trying to find that with google dev console for 3 days now with no luck. Probably I′m just blind or dumb, but if any of you can help, I′ll gladly bash my head against the nearest wall afterwards ??

We also use browser dev tools to crack the code, but of course that only works if we have a link to the site. We cannot use dev tools on an image.

when i declare
.menu li./custom css class name/ > a{
padding-right: 5%;
}

it will work, but not for width (still responsive to the lenght of menu title). I guess I can make different classes for each item and create same width this way. Anyway thanks, I′ll close the topic in few hours (just to be sure that someone who had the same problem won′t come by) if that′s okay.

a layman’s introduction into locating css selectors without browser inspection tool (although it is much easier with the tools):

you can find those css selectors by just looking at the html output of the corresponding section in the browser – ‘view source’

if you are using the default ‘custom menu’ widget in a child theme of Twenty Twelve, the output should be someting like:

<aside id="nav_menu-2" class="widget widget_nav_menu"><div class="menu-side-menu-container"><ul id="menu-side-menu" class="menu"><li id="menu-item-3146" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-3146"><a href="https://localhost/wordpress">Home</a></li>
<li id="menu-item-3026" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3026"><a href="https://localhost/wordpress/about">About</a></li>
<li id="menu-item-2675" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2675"><a href="https://localhost/wordpress/gallery-page">Gallery Page</a></li>
<li id="menu-item-2676" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-2676"><a href="https://localhost/wordpress/topics/uncategorized">uncategorized</a></li>
</ul></div></aside>

from that you can find the common css selector for each menu link; for example .menu-item

to make that specific for the sidebar, add .widget-area before it, and style with whatever fixed or fluid width, padding, background-color, and rounded corners:

.widget-area .menu-item { }

works for everything except width (i already use that for border-radius). When i type something like width: 30px; it works, menu collapse just fine. but with width: 300px; it will come back to responsive. Well it worked with custom css class for each item and paddings (it′s just not very sophisticated). So thanks a lot for your work, putting resolved ??

my class looks like this:
<li id="menu-item-270" class="<strong>realtylogo menu-item menu-item-type-custom menu-item-object-custom menu-item-270</strong>"><a href="https://www.stiles.com/realty"><img src="https://i40.tinypic.com/2py3kfb.png"></a>

[Please post code & markup between backticks or use the code button. Your posted code may now have been permanently damaged by the forum’s parser.]

I tried creating a line in my style.css:

.realtylogo {
float:right;
}

nothing happens….could you please help? “realtylogo” is the css class name I gave to this particular menu item. Any help would be great. Thanks

@bobby.noonan – this isn’t your thread – please start a new one for help on these forums.

Try using Firefox with the Firebug add-on for this kind of CSS troubleshooting. Or use whatever developer tool is available in your web browser.

And next time (and as per the Forum Welcome) please post your own topic.

my appologies for adding on to this thread…i just figured it was on the same topic. I will create a new thread. and thank you esmi for your advice…i will try that