lambwatch

Pants I forgot to include the CSS: <link rel="stylesheet" type="text/css" href="http://www.lambwatch.co.uk/css/rte.css" />

Hi all,I am trying to embed the Yahoo Rich Text Editor in my site. It works fine in FF3 but in IE 7 its positioning is all gone to pot.... http://www.lambwatch.co.uk/forum-thread-89...?showinput=true I have literally copied and pasted the code from http://developer.yahoo.com/yui/examples/ed...itor_clean.html ... I apologise that the CSS for the RTE is compressed, but that is how it came... I am convinced it has something to do with strange positioning but I just cant fathom it out. Any advice greatly appreciated! Here is the code: <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/yahoo-dom-event/yahoo-dom-event.js"></script> <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/animation/animation-min.js"></script> <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/connection/connection-min.js"></script> <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/element/element-min.js"></script> <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/container/container-min.js"></script> <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/menu/menu-min.js"></script> <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/button/button-min.js"></script> <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/editor/editor-min.js"></script> <div id="thread_response_input" class="yui-skin-sam"> <textarea id="editor" name="editor" rows="20" cols="75"></textarea> </div> <script> (function() { var myConfig = { height: '300px', width: '600px', animate: true, dompath: false, focusAtStart: true }; myEditor = new YAHOO.widget.Editor('editor', myConfig); YAHOO.util.Event.onAvailable('iconMenu', function() { YAHOO.log('onAvailable: (#iconMenu)', 'info', 'example'); YAHOO.util.Event.on('iconMenu', 'click', function(ev) { var tar = YAHOO.util.Event.getTarget(ev); if (tar.tagName.toLowerCase() == 'img') { var img = tar.getAttribute('src', 2); YAHOO.log('Found an icon, fire inserticonClick Event', 'info', 'example'); var _button = this.toolbar.getButtonByValue('inserticon'); _button._menu.hide(); this.toolbar.fireEvent('inserticonClick', { type: 'inserticonClick', icon: img }); } YAHOO.util.Event.stopEvent(ev); }, myEditor, true); }); myEditor.on('toolbarLoaded', function() { YAHOO.log('Editor Toolbar Loaded..', 'info', 'example'); var imgConfig = { type: 'push', label: 'Insert Icon', value: 'inserticon', menu: function() { var menu = new YAHOO.widget.Overlay('inserticon', { width: '165px', height: '210px', visible: false }); var str = ''; <?php foreach($Misc->ScanDir($_SERVER['DOCUMENT_ROOT']."/$directory/public/img/smilies/") as $smiley) { ?> str += '<a href="#"><img src="/img/smilies/<?=$smiley;?>" border="0"></a>'; <?php } ?> menu.setBody('<div id="iconMenu">' + str + '</div>'); menu.beforeShowEvent.subscribe(function() { menu.cfg.setProperty('context', [myEditor.toolbar.getButtonByValue('inserticon').get('element'), 'tl', 'bl']); }); menu.render(document.body); menu.element.style.visibility = 'hidden'; return menu; }() }; YAHOO.log('Create the (inserticon) Button', 'info', 'example'); myEditor.toolbar.addButtonToGroup(imgConfig, 'insertitem'); myEditor.toolbar.on('inserticonClick', function(ev) { YAHOO.log('inserticonClick Event Fired: ' + YAHOO.lang.dump(ev), 'info', 'example'); var icon = ''; this._focusWindow(); if (ev.icon) { icon = ev.icon; } this.execCommand('inserthtml', '<img src="' + icon + '" border="0">'); return false; }, myEditor, true); }); myEditor.render(); })(); </script>

sorted! Thank you my friend! Floats instead

Certainly, here is the XHTML --- <div class="overflow"> <h2>LambWatch News!</h2> <div class="newsheadline"> <div class="datebox"> <div class="monthbox">Mar</div> <div class="daybox">23</div> </div> <div class="dateboxcontent"> <p><b><span class='bigger'><!--<a href="/news-38-patch-taken-to-vets-update-2.htm" title="Patch Taken To Vets *update 2*">-->Patch Taken To Vets *update 2*<!--</a>--></span></b> - <em><!--<a href="/archive-day-20090323.htm">-->23/03/2009 14:16:25<!--</a>--></em></p> <p>Patch has been taken to the vet after having had a large prolapse despite never lambing before.</p> </div> </div> <div class="newsheadline"> <div class="datebox"> <div class="monthbox">Feb</div> <div class="daybox">21</div> </div> <div class="dateboxcontent"> <p><b><span class='bigger'><!--<a href="/news-37-first-arrivals-of-2009.htm" title="First Arrivals of 2009">-->First Arrivals of 2009<!--</a>--></span></b> - <em><!--<a href="/archive-day-20090221.htm">-->21/02/2009 17:07:07<!--</a>--></em></p> <p>Here are some photos of our first born lambs of 2009 spending time in the barn.</p> </div> </div> <div class="newsheadline"> <div class="datebox"> <div class="monthbox">Dec</div> <div class="daybox">20</div> </div> <div class="dateboxcontent"> <p><b><span class='bigger'><!--<a href="/news-36-lamb-rescue-mission-ends-happily.htm" title="Lamb Rescue Mission Ends Happily">-->Lamb Rescue Mission Ends Happily<!--</a>--></span></b> - <em><!--<a href="/archive-day-20081220.htm">-->20/12/2008 15:15:15<!--</a>--></em></p> <p>A worrying morning searching for lambs ends happily after Sir David spots them in neighbour's fields!</p> </div> </div> <div class="newsheadline"> <div class="datebox"> <div class="monthbox">Nov</div> <div class="daybox">30</div> </div> <div class="dateboxcontent"> <p><b><span class='bigger'><!--<a href="/news-34-winter-has-arrived-updated.htm" title="Winter Has Arrived *updated*!">-->Winter Has Arrived *updated*!<!--</a>--></span></b> - <em><!--<a href="/archive-day-20081130.htm">-->30/11/2008 13:01:01<!--</a>--></em></p> <p>The first proper cold-snap of the 2008 winter has arrived at LambWatch (and most of the UK!)</p> </div> </div> <div class="newsheadline"> <div class="datebox"> <div class="monthbox">Oct</div> <div class="daybox">27</div> </div> <div class="dateboxcontent"> <p><b><span class='bigger'><!--<a href="/news-32-eleven-new-arrivals.htm" title="Eleven New Arrivals">-->Eleven New Arrivals<!--</a>--></span></b> - <em><!--<a href="/archive-day-20081027.htm">-->27/10/2008 09:12:12<!--</a>--></em></p> <p>We had 11 new arrivals who have been making themselves at home at the farm over the weekend!</p> </div> </div> <div class="newsheadline"> <div class="datebox"> <div class="monthbox">Oct</div> <div class="daybox">18</div> </div> <div class="dateboxcontent"> <p><b><span class='bigger'><!--<a href="/news-31-bulb-planting-for-spring.htm" title="Bulb Planting For Spring!">-->Bulb Planting For Spring!<!--</a>--></span></b> - <em><!--<a href="/archive-day-20081018.htm">-->18/10/2008 16:19:33<!--</a>--></em></p> <p>"Churches Together" arranged a morning of bulb planting amongst the new trees ready for Spring!</p> </div> </div> <div class="newsheadline"> <div class="datebox"> <div class="monthbox">Aug</div> <div class="daybox">22</div> </div> <div class="dateboxcontent"> <p><b><span class='bigger'><!--<a href="/news-28-lone-ranger-reunited.htm" title="Lone Ranger Reunited!">-->Lone Ranger Reunited!<!--</a>--></span></b> - <em><!--<a href="/archive-day-20080822.htm">-->22/08/2008 11:19:19<!--</a>--></em></p> <p>Our friendly visitor sheep was this morning safely reunited with its family across the river :)</p> </div> </div> <div class="newsheadline"> <div class="datebox"> <div class="monthbox">Jul</div> <div class="daybox">10</div> </div> <div class="dateboxcontent"> <p><b><span class='bigger'><!--<a href="/news-26-competition-updated-again.htm" title="Competition *updated again*!">-->Competition *updated again*!<!--</a>--></span></b> - <em><!--<a href="/archive-day-20080710.htm">-->10/07/2008 09:30:30<!--</a>--></em></p> <p>We thought we would have a bit of fun to raise everyone's spirits following a sad week on LambWatch.</p> </div> </div> <div class="newsheadline"> <div class="datebox"> <div class="monthbox">Jul</div> <div class="daybox">6</div> </div> <div class="dateboxcontent"> <p><b><span class='bigger'><!--<a href="/news-25-a-mournful-day.htm" title="A mournful day">-->A mournful day<!--</a>--></span></b> - <em><!--<a href="/archive-day-20080706.htm">-->06/07/2008 22:44:44<!--</a>--></em></p> <p>Today was a very sad and painful day for everyone at and involved with LambWatch :( </p> </div> </div> ....... and so on .......... </div> Here is the relevant CSS div.overflow { overflow:auto; height:inherit; padding-right:4px; } div.datebox { height:51px; width:47px; position:absolute; margin-top:5px; } div.dateboxcontent { position:absolute; margin-left:55px; } div.dateboxcontent p { padding-bottom:0px; } span.bigger { font-size:14px; } div.newsheadline { height:64px; } div.newsheadline div.dateboxcontent { width:440px; } div.newsheadline div.datebox { margin-top:4px; } div.monthbox,div.daybox { text-align:center; font-weight:bold; width:47px; } div.monthbox { text-transform:uppercase; height:16px; padding-top:4px; } div.daybox { font-size:26px; padding-top:3px; height:28px; color:#FFFFFF; }

Hi all, If you visit, http://new.lambwatch.co.uk/news.htm you will immediately see the problem and what I am trying to achive... the odd thing is, the overflow div is registering the need for a scroll bar but it's not putting the content into the div!?!? Most bizarre. This is for both IE7 and FF3.... Even more bizarrely, if you visit http://new.lambwatch.co.uk/chat.htm the same construction is going on but it is working fine.. This leads me to believe it is a problem with the "datebox" divs in the "newsheadline" divs... or something to do with that! Your expert help would be muchly appreciated! Cheers, Dan

love it - in every way! nice job - one comment - you dont have a page dedicated to contacting you so you could lose leads without an online form.

Not at all, id love to do away with that annoying reliance on windows media plugin but sadly its completely out of my control as its code i have to embed in order to show the stream. if only camstreams did a flash alternative that would be brill

Hiya haggisvendor, Had a look at your site and, bearing in mind i generally like a minimalist approach to sites, here are my negative comments first: - I dont like the green background on text "PROFESSIONAL PRIVATE INVESTIGATION SERVICES FOR THE HIGHLANDS." - perhaps it might be better to have a "Web 2.0" gradiented background image instead? - I think the green/blue colour combination is really quite garish - perhaps consider a more subtle gradiented coloured chameleon? Still keep the greens but as chamelons change colour you could perhaps have a subtle mutli-coloured chameleon. That green is too bright for me. - the menu bar at the top - the text is too big for the bar it is in- either add more top and bottom padding or make the text smaller - I would go towards making the text smaller - and also the font looks a bit newbie. - On the same note - the font of the website looks newbie, Arial or verdana is my favourite - but this is just a personal thing. - the inner scrolly content - why are you doing this? It doesn't fit into an 800 height window so results in 2 scroll bars if you are on a widescreen 15'4 laptop at height 800... i think if you want to keep the inner scrolly panel, give it a smaller height so that at 800 height, you still only have the one scroll bar (not the one on the window). Alternatively, do away with the inner scrolly panel and just have it scroll normally. - DESIGN WISE - it looks like you are using frames at some stage but a quick look at your code i couldnt find it but there is definitely some framing going on somewhere - this is a big no no no for search engine optimisation. Frames are bad and they just aren't necessary any more - especially when you can overflow a div now with CSS to acheive same affect (ask if you are unsure how to do this) - DESIGN point 2 - this isnt as much an issue for me but i know some people will HATE the fact you have built it soley on tables. As a believer in no right or wrong myself when it comes to structure of HTML, having no problem with the use of tables for structure, even i think that your table use is a bit excessive. .... Now the good things: - i do like your logo style- the chameleon magnifying the o in investigations - i like the blue theme as blue / surveillance / security is a good colour to use i think.

Please can you be more specific.

Sort of a joke I guess - but I'd prefer to call it a "bit of fun" website

I was counting the seconds to how long it would take to get a response like this I knew that comment would stir up some passions The site is accessible. Please explain why this solution is not usable and accessible... I'd love to hear a real answer and not a fanboy one Then show me a website that you believe is "truly" usable and accessible. Amen Thanks Sam glad you like it

The fact it uses windows media player ios the cause of most issues doh, no can do on that front, Re: the flash huge error - yeah that will be my bad ACtionsScripting for you... it only does that if you have a debugger installed like if you have flash or lfex or something like that. it's really annoying and im not good enough at flash to figure out why it does it

Best of both world's

Yay, thanks for the positive comments!

Not heard that one before so im guessing / hoping its a VLC issue @ITLocal - heard them all before lol