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.

Thanks, good to be up to date with CSS fixes. The problem is still unresolved though. Now, the footer and content-wrapper are beginning in the correct place (at the top of the footer's content) but all other styles are not being applied, e.g. margins and background colours. Very strange and frustrating. It seems that in Chrome's 'inspect element', the column-wrapper is registering but the footer div still isn't inheriting styles from the stylesheet (despite it now having width and height). Any idea? Thanks in advance.

Hello all, I have the below HTML and CSS for my footer. According to Chrome's 'inspect element' tool, the #footer and #column-wrapper have width but no height. This is backed up by the obvious fact there is no background colour to the footer. The three nested divs (column-1/2/3) and their content are displaying as normal. The footer, however, doesn't seem to be containing the divs within it. I have played around with clear:right and overflow:auto but nothing worked so far. Any help appreciated. Audity <div id="footer"> <div id="column-wrapper"> <div id="column-1"> </div> <div id="column-2"> </div> <div id="column-3"> </div> </div> </div> And the following styling: #footer { width:100%; height:auto; background-color: #e6e1dc; margin-top:200px; } #column-wrapper { width:960px; height:auto; margin:0px auto; } #column-1 { float:left; width:200px; } #column-2 { float:left; width:300px; } #column-3 { float:left; width:340px; }

Cheers, I will test out your suggestions.

Hey all, As I've been doing a lot of flyers and posters lately I decided to drop Photoshop in favour of InDesign. Basically, I'm already tearing my hair out so I have returned to the fountain of knowledge to in search of help. Question 1: I want my text to have a gradient so I created a new gradient swatch. The problem is, when I'm in the gradient options I can't use the eye dropper tool to choose colours which appear on the canvas. All I am able to do is slide the CMYK up and down for each colour. How can I use the eye dropper tool with the gradient swatch? Kind regards, Audity

It's easy if you know how http://www.workhappy.net/2006/06/interview_with_.html -AudiTy =o

First, I make a site tree. Then I decide which elements need to be on which page. I then sketch the elements in rough detail, for example, for the 'latest news' section on the landing page I will draw the shape and sketch the position of text, the "Read more" button, the heading etc. I do that for every element on the website. Then I create a wireframe for each unique page, something like this. Then I make it look good. ^^,

Exactly. Designing a page before planning its content is like trying to build a towerblock without the blueprints. You wouldn't start the building until all flaws and kinks had first been resolved in the blueprint; creating a website should be no different. This is just my opinion, but a person whose primary talent is creating visually stunning graphics needs to consider the implications of jumping straight into the aesthetics without thinking through exactly what the website needs to achieve in terms of delivering relevant content and functionality.

You're welcome.

If you want to test your pages on different versions of IE: http://tredosoft.com/Multiple_IE Direct download: http://tredosoft.com/files/multi-ie/multiple-ie-setup.exe Important Notes: * Sometimes IE5, IE5.5 and IE6 crash unexpectedly. * The installer isn't working under Windows Vista....yet. * Read the comments before asking questions. Most of the issues have been discussed below.

I have a vague idea of how it works, but can somebody give me a working example of when they have used BACS? Thanks p.s. don't mean to hi-jack