SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Zealot robcub's Avatar
    Join Date
    May 2008
    Location
    London, England
    Posts
    135
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    IE7 completely broken - OK everywhere else

    I didn't create this website.

    The problem is the navbar which is #main-menu and is float: right; - it seems to push everything out in IE7

    Opera, Wedding singer for hire, function or corporate event - I would appreciate anyone's help.

  2. #2
    Non-Member
    Join Date
    Jun 2010
    Location
    4727′35″N 2618′0″E
    Posts
    1,789
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I see another problem there. And it's not OK in any browser. Try resize the browser window.

    The way I see it, the page displays the most complicated way you can use for such a simple layout.

  3. #3
    Non-Member bronze trophy
    Join Date
    Nov 2009
    Location
    Keene, NH
    Posts
    3,760
    Mentioned
    23 Post(s)
    Tagged
    0 Thread(s)
    It's not ok in ANY browser here, and one peek under the hood explains why -- top to bottom it is chock full of problems/bad coding techniques. MULTIPLE analytics embeds for NOTHING, endless IE conditionals for NOTHING, useless div's and classes round elements that don't need them (like that menu UL)...

    Even simple things like "this is a new page, right? So why the Tranny doctype?"

    Non-semantic markup with a failure to separate presentation from content -- and using classes like "left" and "right" instead of saying what things ARE and WHY they're being styled-- goes with the tranny doctype; It's basically HTML 3.2 with a XHTML tranny doctype on it to try and hide that... and poorly since it's not even CLOSE to being XHTML with all the unclosed standalone tags.

    Even the keywords meta is a disaster -- space is NOT a delimiter for keywords.... or the use of the underline tag inside an anchor (what the?!?)

    It REEKS of duct tape and chewing gum fixes...

    For HTML there is probably little reason for the code to be a whole lot more than:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html
    	xmlns="http://www.w3.org/1999/xhtml"
    	lang="en"
    	xml:lang="en"
    ><head>
    
    <meta
    	http-equiv="Content-Type"
    	content="text/html; charset=utf-8"
    />
    
    <meta
    	http-equiv="Content-Language"
    	content="en"
    />
    
    <meta
    	name="description"
    	content="Hire opera singer, Saira, for your stylish wedding ceremony, corporate event or special occasion in London or UK. A professional female vocalist, Saira can sing soprano arias oh mio babbino caro or sacred church songs Ave Maria for weddings. Saira performs with string quartet, piano, backing tracks or unaccompanied"
    />
    
    <meta 
    	name="keywords"
    	content="opera, wedding, singer, london, soprano, ceremony, corporate, entertainer, musician, soloist"
    />
    
    <link
    	type="text/css"
    	rel="stylesheet"
    	href="screen.css"
    	media="screen,projection,tv"
    />
    
    <title>
    	Opera, Wedding singer for hire, function or corporate event
    </title>
    
    </head><body>
    
    <div id="pageWrapper">
    
    	<h1>
    		Arias
    		<span><!-- image replacement --></span>
    	</h1>
    
    	<div class="homeContent">
    		<p>
    			From an elegant wedding ceremony to a large scale charity ball or corporate event, soprano Saira knows how to create a perfect performance. As an experienced and professional classical vocalist, Saira provides a seamless and comprehensive service, from selecting the perfect songs and accompaniment right through to the moment where her beautiful voice floats through the crowd and leaves her audiences spellbound. 
    		</p>
    		<ul class="menu">
    			<li><a href="biography.html">Biography</a></li>
    			<li><a href="weddings.html">Weddings</a></li>
    			<li><a href="corporate-events-concerts.html">Corporate Events &amp; Concerts </a></li>
    			<li><a href="song-samples.html">Song samples</a></li>
    			<li><a href="gallery.html">Gallery</a></li>
    			<li><a href="contact.html">Contact</a></li>
    		</ul>
    	<!-- .homeContent --></div>
    	
    	<div id="footer">
    	  <span>Copyright Arias 2011</span>
    	  Web design by <a href="http://leonh.net">Leonh</a>
    	<!-- #footer --></div>
    	
    <!-- #pageWrapper --></div>	
    
    </body></html>
    Which throws more than 50% of the markup in the trash. If I have time later I could quickly belt out some CSS to go with that...

    Though honestly the site is filled with what I like to call "non-viable design elements" -- like the fixed height containers around the content, fixed metric fonts being an accessibility /FAIL/, etc, etc...

    As such my advice is throw that garbage away and have it redone by a professional -- there's NOTHING worth even TRYING to save there, and if they paid money for it, they should sue for that money back.

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,355
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    I didn't see the problem you mentioned with the menu but I see the same problem as noonnope mentioned above

    That old absolute centring technique is a bad method and should be converted to auto margins instead.

    Code:
    #inner {
     width: 876px;
     height: 650px;
     margin:auto;
     text-align:left;
    }
    If it must be a fixed height layout then it would also be better if you use ems instead of px for the height so that users could resize the text without it overflowing.


    Edit:


    Hang around and I'm sure Jason (deathshadow) will come up with something much better than the quick fix I offered above

  5. #5
    SitePoint Zealot robcub's Avatar
    Join Date
    May 2008
    Location
    London, England
    Posts
    135
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    You're right noonnope - something very easy made very complicated...

    deathshadow60, I've added more duct tape and chewing gum fixes. I know I shouldn't have but I have, I'm sorry. Thank you for your re-do and confirming everything I thought about it.

    Paul O'B - I tried your #inner fix but I couldn't get it to work - it put the whole site to the bottom right off the browser window.

    Thank all of you so much. I think it's 99% OK now. Not perfect code (well, dreadful code) but I'm trying to persuade the client to go for a complete WordPress makeover next time so I'm leaving this one well alone now.

  6. #6
    Non-Member bronze trophy
    Join Date
    Nov 2009
    Location
    Keene, NH
    Posts
    3,760
    Mentioned
    23 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by robcub View Post
    but I'm trying to persuade the client to go for a complete WordPress makeover next time so I'm leaving this one well alone now.
    Because turdpress is going to have so much better markup...

  7. #7
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,355
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by robcub View Post

    Paul O'B - I tried your #inner fix but I couldn't get it to work - it put the whole site to the bottom right off the browser window.
    Then you probably forgot to remove the existing styles from #inner . All you need is the code I gave you above and remove your existing #inner styles.

  8. #8
    SitePoint Zealot robcub's Avatar
    Join Date
    May 2008
    Location
    London, England
    Posts
    135
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Thank you, Paul, sorry I've only just seen your reply.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •