AudiTy

Hi there, I have a website using WordPress.org which can be viewed here. The theme I am using is Brooklyn. Everything is the latest version. The issue is in the team section named 'L'Équipe' ('The Team' in English) which has two columns which don't stack at smaller screen sizes. The result is that, on mobiles for example, that the content is squished together. When I setup the 'team' page template to have three columns it all stacks perfectly. How can I get the two columns to stack at a certain breakpoint? Thanks in advance.

Hi there, I have developed a website for a client which you can visit at http://curiousbookco.com/. The developer I am using has proven unreliable and I just want want this client's website signed off as it is dragging on. Basically, in the primary navigation, the client wants to make sure that the the menu items on the left and right of the logo maintain equal spacing from the logo as the window's width is reduced. As the menu items on the left are collectively narrower than those on the right due to the amount of characters this is proving difficult, apparently. If anyone can suggested a solution which will work across browsers (IE9+) and devices that would be most appreciated! Best, Audity -- The HTML: <ul> <li><a href="/">home</a></li> <li><a href="/about-us/">about us</a></li> <li><a href="/services/">services</a></li> </ul> <ul> <li><a href="/"><img src="/images/logo.png" alt="Logo"></a></li> </ul> <ul> <li><a href="/design-suite/">design suite</a></li> <li><a href="/clients/">clients</a></li> <li><a href="/contact-us/">contact</a></li> </ul> And the CSS: header ul { text-align: center; overflow: hidden; margin: 0 auto 0 auto; } header ul:first-child { float: left; margin-top: -3px; } header ul:last-child { float: right; margin-top: -3px; } header ul:nth-child(2) { position: absolute; left: 0px; right: 0; width: 148px; top: 20px; height: 79px; text-align: center; width:auto !important; z-index: -100; } header ul:nth-child(2) li { margin-top: 0; float: none; } header ul li { margin-top: 85px; display: inline-block; margin-left: 50px; } @media screen and (max-width: 1100px) { header ul li { margin-left: 20px; } } header ul li:first-child { margin-left: 0; } header ul li a { font-family: 'ralewaysemibold'; text-transform: uppercase; text-decoration: none; font-size:14px; color: #2D323B; } header ul li a img { max-height: 90px; }

Hi, I have an instance of Jplayer (HTML5 audio player for jQuery) and an instance of JW Player (HTML5 video player) on the home page of a website I'm jazzing up for a friend: http://www.creativetuition.co.uk As you can see/hear, the audio player at the top auto-plays. I'm trying to work it so a user can play the video below and have the audio player pause automatically. If it was possible, it would be perfect if the audio player began playing again if the video was paused or ended. I presume I have to use some sort of event 'listener', but really I am struggling and would really appreciate any help you guys can offer. Thank you Audio Player HTML <div class="jp-audio"> <div class="jp-type-playlist"> <div id="jp_interface_2" class="jp-interface"> <ul class="jp-controls"> <li><a href="#" class="jp-play" tabindex="1" style="display: block; ">play</a></li> <li><a href="#" class="jp-pause" tabindex="1" style="display: none; ">pause</a></li> <li><a href="#" class="jp-previous" tabindex="1">previous</a></li> <li><a href="#" class="jp-next" tabindex="1">next</a></li> </ul> <div class="jp-progress"> <div class="jp-seek-bar" style="width: 100%; "> <div class="jp-play-bar" style="width: 1.2201517062851868%; "></div> </div> </div> <div class="jp-current-time">00:02</div> <div class="jp-duration">02:49</div> </div> <div id="jp_playlist_2" class="jp-playlist"> <ul> <li class="jp-playlist-current"><a href="#" id="jp_playlist_2_item_0" tabindex="1" class="jp-playlist-current">Track 2</a></li> <li><a href="#" id="jp_playlist_2_item_1" tabindex="1">Track 2</a></li> <li><a href="#" id="jp_playlist_2_item_2" tabindex="1">Track 3</a></li> <li><a href="#" id="jp_playlist_2_item_3" tabindex="1">Track 4</a></li> <li><a href="#" id="jp_playlist_2_item_4" tabindex="1">Track 5</a></li> <li><a href="#" id="jp_playlist_2_item_5" tabindex="1">Track 6</a></li> <li class="jp-playlist-last"><a href="#" id="jp_playlist_2_item_6" tabindex="1">Track 7</a></li> </ul> </div> </div> </div> Video HTML <div id="mediaspace_wrapper" style="position: relative; width: 470px; height: 320px; "> <object type="application/x-shockwave-flash" data="js/player.swf" width="100%" height="100%" bgcolor="#000000" id="mediaspace" name="mediaspace" tabindex="0"> <param name="allowfullscreen" value="true"> <param name="allowscriptaccess" value="always"> <param name="seamlesstabbing" value="true"> <param name="wmode" value="opaque"> <param name="flashvars" value="netstreambasepath=http%3A%2F%2Fwww.creativetuition.co.uk%2F&id=mediaspace&author=Creative%20Guitar%20Tuition&file=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DRyXTJkLRSEg&controlbar.position=bottom&volume=90"> </object> </div> <div id="reasons-video"> <script type="text/javascript"> jwplayer('mediaspace').setup({ 'flashplayer': 'js/player.swf', 'author': 'Creative Guitar Tuition', 'file': 'http://www.youtube.com/watch?v=RyXTJkLRSEg', 'controlbar': 'bottom', 'width': '470', 'height': '320' }); </script> </div>

As per the title, is there any way to turn off the slices that automatically appear but which you didn't specifically create? Cheers!

My problem with subtle gradients is the banding in my experience. I have been battling with gradients for a while now and it seems impossible to me to get a subtle gradient without banding. I'm using Photoshop and Illustrator CS5 and I'm having the same problem in both. @dap I followed the steps in the tutorial but I still got bandin in trying to create a subtle greyscale gradient to add depth to a design. Any common things that I could be doing wrong?

Ok, so I have fixed my problem. Instead of 'uniting' the shapes I held option while I clicked 'unite' which created a compound shape instead. This meant the two objects kept their own paths but they acted like one object. Not quite sure why this worked but it did, so I'm happy Cheers everyone for the help.

Thanks for the link, I would have thought this would solve the issue but I have set the preferences as per the article and it's still not working. I have, however, identified the origin of the issue through redrawing the shape again and testing it at each stage. I have identified that the problem with stroke not scaling and the shape becoming warped only occurs once I start uniting two shapes or using 'minus front' in pathfinder to remove a portion of the object. What's strange though is that just using 'minus front' to create a donut shape poses no issue, only when the shape becomes more complex. I hope this helps explain the issue further, any ideas? Very frustrating. Thanks

Anyone else know why one of my object's strokes is not scaling despite being set to scale?

I followed your suggestion by expanding the stroke (the fill caused horrible gradient banding) and, although the stroke appeared proportional, the path became uneven and had distortions in the shape. This is very frustrating! All the other objects which were created in exactly the same way are fine. Maybe I'll just have to redraw it. Thanks

Afternoon, I have two text objects and two paths with fills and strokes. My Illustrator CS5 preferences are set to scale strokes and effects. When I select all objects and resize them, however, the bottom object distorts and the stroke does not scale with the object's size. Also, the shape warps between certain anchor points. I have tried restarting Illustrator and deleting the preference file (holding CTRL+CMD+SHIFT+OPTION when Illustrator starts) but nothing worked so far. The problem is the same across all artboards and files. Here is a screenshot of the problem before and after rescaling. Any help appreciated, Audity

Hi all, I am a recent convert from Photoshop to Illustrator (freelance calls) and one thing that I'm still having trouble with is not being able to just delete a part of an object I'm working with. In this case, I'm designing a logo and using a script font. On the text, the last letter of each word trails off in anticipation of the next letter (which obviously isn't there). I want to somehow delete this trailing part of the letter, but bearing in mind that the logo will need to be saved as a PNG with transparency so just covering it up with a shape the same colour as the background is not an option. Any help much appreciated, Audity

I think I have solved the problem. After faffing around for a while it seems the one property that made the difference was 'overflow:hidden' on the footer div. Thanks for all the help, I learned some really good stuff. Audity

The footer's styling is in the stylesheet as follows: #footer { width:100%; height:600px; background-color: #e6e1dc; margin:200px 0; overflow: hidden; } It should be in the CSS folder, within the zip file.

I don't have it live yet, but I have zipped my local copy and put it on media fire for you to download. Hope that works.

Thanks for the fix, though I have tried applying the overflow property to both the footer and column-wrapper but it hasn't changed anything.