[thelist] html/css centering problem for ya

Will willthemoor at gmail.com
Tue Aug 14 12:30:00 CDT 2012


On Tue, Aug 14, 2012 at 9:09 AM, John Allsopp <john at johnallsopp.co.uk>wrote:

> <snip>
> So in order to get the middle, I'd have to know the width, the font size
> and the rest and that all feels very wrong.
>
</snip>

If you have a fixed number of nav elements, you can use psuedo elements on
the center-1 and center+1 <li> elements. You could target them via class/id
or nth-child selectors.

You could also stick it in there with Javascript. I will not tell anyone,
promise.



>
> On 14/08/12 15:57, Audrey Blumeneau wrote:
>
>> Hi John,
>>
>> Would the technique that Chris Coyier explains by using pseudo-elemenets
>> :before and :after work for what you are doing?
>>
>> http://css-tricks.com/float-**center/<http://css-tricks.com/float-center/>
>>
>> I am thinking that you are faking the user out by thinking that the words
>> are all one line…. but you would have to find the "middle" and split them
>> into two div's.
>>
>> Just a thought.
>>
>> Audrey Blumeneau
>>
>>
>>
>>
>> On Aug 14, 2012, at 5:49 AM, John Allsopp wrote:
>>
>>  Hi everyone
>>>
>>> This http://www.johnallsopp.co.uk/**tc1/<http://www.johnallsopp.co.uk/tc1/>
>>>
>>> What I'm wanting is for the circle to be in the middle of the menu
>>> (words) so it's basically up a bit.
>>>
>>> Let's forget word wrapping for now and just assume all the words are in
>>> one line .. what do you suggest for putting the image in the middle and
>>> flowing the words around it?
>>>
>>> J
>>>
>>> --
>>> ------------------------------**------------------------------**-
>>> John Allsopp
>>> tel: 01723 376477
>>> Twitter: @JohnAllsoppIM
>>>
>>> --
>>>
>>> * * Please support the community that supports you.  * *
>>> http://evolt.org/help_support_**evolt/<http://evolt.org/help_support_evolt/>
>>>
>>> For unsubscribe and other options, including the Tip Harvester
>>> and archives of thelist go to: http://lists.evolt.org
>>> Workers of the Web, evolt !
>>>
>>
>
> --
> ------------------------------**------------------------------**-
> John Allsopp
> tel: 01723 376477
> Twitter: @JohnAllsoppIM
>
> --
>
> * * Please support the community that supports you.  * *
> http://evolt.org/help_support_**evolt/<http://evolt.org/help_support_evolt/>
>
> For unsubscribe and other options, including the Tip Harvester
> and archives of thelist go to: http://lists.evolt.org
> Workers of the Web, evolt !
>


More information about the thelist mailing list