Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Bestbet

Members
  • Joined

  • Last visited

  1. Hi, thanks - did you mean to post a screen shot ? Also - are you looking at the main site http://www.travelogue.ie/storiespage2.htm or at the site with the test reset code http://www.travelogue.ie/storiespage2a.htm ? the site works on horizontal scrolling (not vertical) - so perhaps that is why you are seeing a cut-off ? thanks,
  2. Thanks for your reply, I tried adding this code to the page - but I am not sure how to do it correctly - in that it has had some strange effects on the layout of the page - for an example see here: http://www.travelogue.ie/storiespage2a.htm If you have insight as to why this is happening I would really appreciate it. regards, CLaire
  3. Hello, I am having a problem with a website that is mainly rollovers http://www.travelogue.ie/ As you can see once you scroll right and put your mouse over a silhouette a text story appears. My problem is that the client is reporting a blue line at the edge of the rollover (around the silhouette) AS far as I can see this is coming from the outline that I have mapped out for the rollover in fireworks. But it is not appearing on lower res. monitors (like mine 1200 x 768) only on her super high res monitor. Can anyone tell me why this might be happening ? and if there is a fix ? Screen shot of blue line attached Many thanks,
  4. I have modified the css to layout text next to the image - but realised I also needed it more or less vertically centred. So I think I got it, by putting two divs into one container div. yay! Yes I can see why this would not be the best idea, but the client has signed off on the rollover design - where users put cursor over person (an image file) to get that person's story.(an image file) So in order to convinvce them that doing it in CSS is better (faster loading, less file size etc) the functionality has to be the same. In the original design when you roll over the person, their name also comes up in white (see: http://www.travelogue.ie/NewDesign.htm) If there is any way for my to do this - have the story paragraph become visible and the name become visible when the cursor hovers over the person graphic - it would be brilliant. I really appreciate your time and knowledge ... I would so much rather this be a CSS website!! rollovers are so clunky and horrible to make or alter once you've made them. thanks again,
  5. Silly silly me - thanks for your patience - propped my eyes open this time !! It works in Safari. relief ....... thank you.
  6. Thanks for this MTeam, I made the corrections but the rollover is still not working in Safari on my machine. I don't have IE - so I will need to try it out on a PC before I can confirm that. I will get back to you on it.
  7. Thanks a million for that. I went and tried it out ) with some success but a few small problems. New link is http://www.travelogue.ie/21FebCSSLayouttest1/fixedlayout.html I have had some problems positioning the text and am not sure how to structure this. as you can see it is not to the left of the iamges as in the original design. Also I would like the user to hover over the silhouettes themselves rather than the text for the text to appear. my CSS knowledge is fairly basic I know, I have mainly being deconstructing things to see how they work, but my knowledge of how it fits together is a bit sketchy. I put the image and text in seperate divs because it seemed to work that way and not if they were in the same div. But even to me the CSS looks a bit bloated. any thoughts ? Many thanks. THE CSS code <style type="text/css"> <!-- #header { background: #ffffff; position: absolute; top: 0px; left: 0px; width: 800px; height: 98px; } #div1 { background: #c2c2c2; position: absolute; top: 98px; left: 0px; width: 844px; height: 508px; } #div1 p { visibility: hidden; } #div1 :hover p { visibility: visible; } #div2 { background: #c2c2c2; position: absolute; top: 98px; left: 844px; width: 1362px; height: 508px; } #div2 p { visibility: hidden; } #div2 :hover p { visibility: visible; } --> </style> THE HTML <body> <div id="header">Header Section</div> <div id="div1"><img style= "position:absolute; TOP:54px; LEFT:10px; width:348; height:454;" src="silhouette1.png"> </style><div id ="div1 p"> <p> It was a fairly warm summer evening - actually balmy if you can believe it. We were staying at the Ardilaun Hotel in Galway, and were about a week into the coach tour. I had a big group of Canadians with me. I was sleeping in the buff because it was too warm for anything else. Like that, I went to the loo some time in the very early morning, maybe it was around 2:00 a.m. I was on the other side of the door and it closed behind me. Only I hadn't walked into the loo - I had walked out of my hotel room into the hallway! You see, during the busy tourist season, you wouldn't know where you are from one day to the next. Every hotel room starts to look the same. So I was wondering how I was going to manage this and hoping to see a porter somewhere. But it was very late at night. I started hearing voices - people were coming up the stairs. I think there was a wedding going on. I started looking down the hallway, this way and that. I spotted a door ajar. It turned out to be some sort of utility room or something, and would you believe, there was a big bunch of keys on the desk with a skeleton key amongst them. Luckily, I was able to run back into my room before being spotted.</p></div></div> <div id="div2"><img style= "position:absolute; TOP:59px; LEFT:10px;width:427; height:449;" img src="silhouette2.png"></style> <div id ="div2 p"> <p>Back when I was a hackney driver, I got this call to pick up a lady at St. Vincent's Hospital. She came out wearing these slippers and seemed a bit upset. I brought her home to Bray. Coincidentally, about a week later I was in the same area and got a call to take her home again. Like before, she was wearing those slippers but dressed normally besides. I had to ask why she was wearing them. She told me she wore the slippers for comfort because she was in the hospital the entire day, every day visiting her sick husband. This broke the ice and she then proceeded to tell me their story. She was British, her husband was of Irish descent, and they used to live in the UK. A while back, he had wanted to discover his roots and made some progress - a minister helped him research his baptism and he made a trip over here to gather more information. He had what he called his "Irish box" with a few precious keepsakes. One item was a photograph of him on the shoulders of his grandfather walking outside the Gresham Hotel on O'Connell Street. The granddad had worked for Guinness as a cooper making those wooden barrels. His father had died very young in London. Anyway, they came to the end of the line and couldn't get any more information. However, they bought a place in Ireland and eventually settled here. When I heard about how the granddad was a cooper, it struck me because I know there weren't too many with that skill. So I told her, "Bear with me now. Don't say a thing 'til I ask you a few questions." First I asked her, "Is it possible your husband's father was killed while fighting a fire during the blitz in London?" Then I asked, "Is it possible your husband's name is Campbell?" Well, that stunned her. It turns out, her husband was my first cousin - the son of my mother's only brother. The very next day, I contacted all my brothers and sisters. Every single one of them, all four brothers and three sisters, and their children went up to St. Vincent's Hospital - it was like rent-a-crowd. We had a big visit with him, we told her husband all kinds of stories and he showed us everything in his "Irish box". He died three days later and was buried surrounded by family. </p></div></div> </body>
  8. Great, Thanks this is the link - http://www.travelogue.ie/NewDesign.htm
  9. Hello, Just popping by to introduce myself, I am self taught webdesigner from an art background. I used to work much more often on webdesign projects about 6 -8 years ago , but mainly teach in an art college now and work on art related research. As it happens my professional past has come back to bite - and I am involved in designing a website for an artist's project about transport and people's commuting stories. This is great fun but causing me some small problems as you will see from my first post in the forum under CSS/Javascript! I am not as up to date on CSS and coding as I would like to be, so I look forward to learning a whole lot more.
  10. Hello, This is my first post, so I hope its in the right place. I am currently designing a graphic heavy website - it is for an artists project. It involves over 50 silouhettes of people and 50 stories - one for each person. These are laid out horizontally, as if the people where sitting in a long row. When you place a cursor over the figure the story displays) I attempted to layout this in CSS and found my skills were not advanced enough. (the main problem being the exact placement of people and stories. So I resorted to using Javascript rollovers. The rollovers seem to display fine in Firefox and Chrome but they do not display in Internet Explorer or Safari. Is there a way to make IE/Safari display the rollovers ? Is my rollover code wrong? I would be happy to try CSS again if someone could suggest a surefire way of doing it. I don't know if I am allowed to post a link here, but if someone could take a look I can send them the link. Any help on this would be much appreciated, Thank-you.

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.