Jump to content

confused and dazed

Members
 View Profile  See their activity

  • Posts

    313

  • Joined

  • Last visited

 Content Type 

Everything posted by confused and dazed

  1. confused and dazed
    ...... ummm problem though.... now there is COMPLETELY no content on Safari/firefox/etc..... <!--[if lte IE 8 ]>SOME CODE <![endif]--><!--[if !lte IE 8 ]> A BUNCH MORE CODE <![endif]-->
  2. confused and dazed
    It all just disappeared!!!!! SWEET!!! thanks.
  3. confused and dazed
    Hello internet. I am starting to work with media Querys (like ones below): @media screen and (max-width : 460px) { .someclassname {display: block;} } I am struggling to style IE10 browsers and below (I anticipate half of my users will be IE folks) because the media querys will not work for them. I can use the conditional statement below but the browser will still attempt to put the rest of the code on the page making it look all screwed up: <!--[if lte IE 8 ]> SOME CODE <![endif]--> A BUNCH MORE CODE How do I use html conditional statements to get rid of “A BUNCH MORE CODE” on the site?
  4. confused and dazed
    I have it!!!!!! The root cause to the squirly font issue is the google font type Marcellus SC. For whatever reason this particular font is not robust coming from Google. Any thoughts on why? I called it up right after declaring a doc type. <!DOCTYPE html><html><head> <link href='http://fonts.googleapis.com/css?family=Vidaloka|Permanent+Marker|Marcellus+SC' rel='stylesheet' type='text/css'>
  5. confused and dazed
    OK so I did some "downsizing" on my code and here is what I have for the html and css <div class="nav_bannerx"><button type="button" class="a1" onclick="changesel1()"><strong>1</strong></button><button type="button" class="a2" onclick="changesel2()"><strong>2</strong></button><button type="button" class="a2" onclick="changesel3()"><strong>3</strong></button><button type="button" class="a2" onclick="changesel4()"><strong>4</strong></button><button type="button" class="a2" onclick="changesel5()"><strong>5</strong></button><button type="button" class="a2" onclick="changesel6()"><strong>6</strong></button><button type="button" class="a3" onclick="changesel7()"><strong>7</strong></button></div>.nav_bannerx{width:847px; height:37px; margin-top: 20px; background:transparent; border: 0px solid Black;}.a1{width:120px; height:36px; background: url(menu1.jpg); margin-left:0px; border: 0px solid Black; color:#ffffff; font-size:9pt; font-family:arial;}.a1:hover{background: url(hmenu1_1.jpg); color:#000000; }.a2{width:120px; height:36px; background: url(menu2.jpg); ; border: 0px solid Black; color:#ffffff; font-size:9pt; font-family:arial;}.a2:hover{background: url(hmenu2.jpg); color:#000000; }.a3{width:120px; height:36px; background: url(menu3.jpg); ; border: 0px solid Black; color:#ffffff; font-size:9pt; font-family:arial;}.a3:hover{background: url(hmenu3.jpg); color:#000000; } Classes a1,a2,a3 are needed because there are three different images I am using for the buttons - but i eliminated the rest. Its looks great and there are no so many classes. On a side note the squirly is still there... Still looking into it.
  6. confused and dazed
    I truly appreciate the responses on this one. As far as the font squirly issue I would not be able to give exact code on this one. I will have to see how hosting could help me get out of it or really take a look at how the order of my code may be effecting it. I have used iframe before and I have not had these issues. I will take this one on my own. I would still like to know suggestions on how to eliminate using so many classes (as well as using position:absolute) to give very specific <div> locations on a page. Right now I have not been able to figure out how to postion images and <div> exactly where I want them to go without using classes and position:absolute.
  7. confused and dazed
    OK so you guys don’t like the code all that much. I get it. So here are some very specific things: 1. I use all the classes because I have not found another way to position the <div> elements the way I want to specifically see them (margin wise). A suggestion of a better way to position elements would be helpful. 2. I use position:absolute because I have <div> elements that need specific locations on the page so I use that to direct them right where I want to be. A suggestion of a better way to position <div> elements would be helpful. 3. The code does has a lot of useless stuff on it simply because I am anticipating needing some of those things in the future like boarder and I like the change fonts a lot. I can leave all the things out of the code in the future until I actually need them that’s not a big deal. I am still going to try and reproduce the issue and transfer all the code. Answers to my questions above would be helpful. ******* OK so I did a little more digging and it appears part of the issue may be a hosting problem. I put src equal to other sites (other domains) I have made and there was no issue - I also put espn.com and cnn.com in there and no problems what so ever. But, as soon as I made the src from the same domain as the new site I am making the issue came back. Should I create a new folder in the hosting account and place all the iframe webpages in that new folder? Why would this matter? Any ideas?
  8. confused and dazed
    I will work on it and repost later.....
  9. confused and dazed
    Scratch that.... still bad!!! Stuck big time.
  10. confused and dazed
    So......... I did a little playing around with the code and it appears that if I DONT call an external css file to style the menu buttons and iframe elements the fonts do not go all squirly on me. WHY IS THIS? I was told as long as I place the callout for the css external file at the beginning of the header this would NEVER be an issue.
  11. confused and dazed
    I did just that and I noticed that the fonts do not change as you click the menu selections and hover over them. I think this is because the src does not direct the iframe to an actual webpage. I took out the following code in my actual site and the font issue went away. It appears this issue has EVERYTHING to do with the iframe element and how it effects the page. <div class="tag2"><img src="hd3_1.jpg" width="529" height="320" style="margin-top: 0px;"/><iframe id="blocks" class="iframe1" frameborder="0" src="" ><p>Your browser does not support this function.</p></iframe></div>
  12. confused and dazed
    No nav bar? There should be 7 menu selections put together by the class="a1", "a2", etc..."
  13. confused and dazed
    Reposted.
  14. confused and dazed
    Last message edited.
  15. confused and dazed
    O.K. so I cleaned up my code a bit and I am still having the same issue. What I am seeing is once I click on any of the buttons AND STAY HOVER'D OVER THE MENU BAR WHILE MOVING THROUGH THE MENU SELCTION the font gets all squirly and changes out of the font I selected. Once I move off the menu bar most of the font corrects itself but its not until I move over that specific text that remains messed up will THAT font correct itself. Whats going on? Here is my code: <!DOCTYPE html><html><head><script src="sub_br.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="/madsite2014.css"><link hr<link href='http://fonts.googleapis.com/css?family=Permanent+Marker|Marcellus+SC' rel='stylesheet' type='text/css'>type="text/javascript">function changesel1(){document.getElementById("blocks").src="";}function changesel2(){document.getElementById("blocks").src="";}function changesel3(){document.getElementById("blocks").src="";}function changesel4(){document.getElementById("blocks").src="";}function changesel5(){document.getElementById("blocks").src="";}function changesel6(){document.getElementById("blocks").src="";}function changesel7(){document.getElementById("blocks").src="";}</script></head><body><center><!-- Start Main Nav Bar --><div class="nav_bannerx"><div class="menu1"><button type="button" class="a1" onclick="changesel1()"><div class="menuc1"><strong>1</strong></div></button></div><div class="menu2"><button type="button" class="a2" onclick="changesel2()"><div class="menuc2"><strong>2</strong></div></button></div><div class="menu3"><button type="button" class="a3" onclick="changesel3()"><div class="menuc2"><strong>3</strong></div></button></div><div class="menu4"><button type="button" class="a4" onclick="changesel4()"><div class="menuc2"><strong>4</strong></div></button></div><div class="menu5"><button type="button" class="a5" onclick="changesel5()"><div class="menuc2"><strong>5</strong></div></button></div><div class="menu6"><button type="button" class="a6" onclick="changesel6()"><div class="menuc2"><strong>6</strong></div></button></div><div class="menu7"><button type="button" class="a7" onclick="changesel7()"><div class="menuc3"><strong>7</strong></div></button></div></div><!-- End Main Nav Bar --><div class="tag1"><span style="color:#000000; font-size:40pt; font-family:Marcellus SC">MySite</span><br><span style="color:#000000; font-size:14pt; font-family:Permanent Marker"<i>The best site ever</i></span></div><div class="tag2"><img src="hd3_1.jpg" width="529" height="320" style="margin-top: 0px;"/><iframe id="blocks" class="iframe1" frameborder="0" src="" ><p>Your browser does not support this function.</p></iframe></div><div class="tag3">2014</div></center></body></html> HERE IS THE OFFLINE CSS FILE INFO .tag1{width:847px; height:99px; margin-top: 0px; background:transparent; border: 0px solid Black;}.tag2{width:847px; height:320px; margin-top: 0px; background:transparent; border: 0px solid Black;}.tag3{width:847px; height:46px; margin-top: 2px; background:transparent; border: 1px solid Black;color:#000000; font-size:34pt; font-family:Marcellus SC}.nav_bannerx{width:847px; height:37px; margin-top: 26px; background:transparent; border: 0px solid Black;}.menuc1{width:120px; height:20px; float: left; ; margin-top: 4px; background:transparent; border: 0px solid Black; }.menuc2{width:120px; height:20px; float: left; ; margin-top: 4px; background:transparent; border: 0px solid Black;}.menuc3{width:120px; height:20px; float: left; ; margin-top: 4px; background:transparent; border: 0px solid Black;}.menu1{Position:absolute; width:120px; height:36px; margin-left:0px; background: url(menu1.jpg);}.menu2{Position:absolute; width:120px; height:36px; margin-left:121px; background: url(menu2.jpg);}.menu3{Position:absolute; width:120px; height:36px; margin-left:242px; background: url(menu2.jpg);}.menu4{Position:absolute; width:120px; height:36px; margin-left:363px; background: url(menu2.jpg);}.menu5{Position:absolute; width:120px; height:36px; margin-left:484px; background: url(menu2.jpg);}.menu6{Position:absolute; width:120px; height:36px; margin-left:605px; background: url(menu2.jpg);}.menu7{Position:absolute; width:120px; height:36px; margin-left:726px; background: url(menu3.jpg);}.a1{width:120px; height:36px; background: url(menu1.jpg); border:0px solid gray; color:#ffffff; font-size:9pt; font-family:arial;}.a1:hover{width:120px; height:36px; background: url(hmenu1_1.jpg); border:0px solid gray; color:#000000; font-size:9pt; font-family:arial;}.a2{width:120px; height:36px; background: url(menu2.jpg); border:0px solid gray; color:#ffffff; font-size:9pt; font-family:arial;}.a2:hover{width:120px; height:36px; background: url(hmenu2.jpg); border:0px solid gray; color:#000000; font-size:9pt; font-family:arial;}.a3{width:120px; height:36px; background: url(menu2.jpg); border:0px solid gray; color:#ffffff; font-size:9pt; font-family:arial;}.a3:hover{width:120px; height:36px; background: url(hmenu2.jpg); border:0px solid gray; color:#000000; font-size:9pt; font-family:arial;}.a4{width:120px; height:36px; background: url(menu2.jpg); border:0px solid gray; color:#ffffff; font-size:9pt; font-family:arial;}.a4:hover{width:120px; height:36px; background: url(hmenu2.jpg); border:0px solid gray; color:#000000; font-size:9pt; font-family:arial;}.a5{width:120px; height:36px; background: url(menu2.jpg); border:0px solid gray; color:#ffffff; font-size:9pt; font-family:arial;}.a5:hover{width:120px; height:36px; background: url(hmenu2.jpg); border:0px solid gray; color:#000000; font-size:9pt; font-family:arial;}.a6{width:120px; height:36px; background: url(menu2.jpg); border:0px solid gray; color:#ffffff; font-size:9pt; font-family:arial;}.a6:hover{width:120px; height:36px; background: url(hmenu2.jpg); border:0px solid gray; color:#000000; font-size:9pt; font-family:arial;}.a7{width:120px; height:36px; background: url(menu3.jpg); border:0px solid gray; color:#ffffff; font-size:9pt; font-family:arial;}.a7:hover{width:120px; height:36px; background: url(hmenu3.jpg); border:0px solid gray; color:#000000; font-size:9pt; font-family:arial;}.iframe1{position:absolute; background-color:#000000; width:479px; height:267px; float:left; ; margin-top: 22px; border: 1px solid #003D3D;}.home1{width:465px; height:254px; float:left; ; margin-top: -2px; border: 1px solid #ffffff;}
  16. confused and dazed
    Maybe my question was not written well enough. I use a first level <div> element to contain images, text, etc... I use a second level <div> element within the first level <div> element to enclose my text (text which is enclosed within the second level <div> element) so I can place it anywhere I want within the first level <div> element. Is there a better method for Text placement than what I have done?
  17. confused and dazed
    I have no idea why I have the img within the frame element... strange. F'd up really. So how do I validate my pages as you suggest? I have been using <div> elements because I like to control where the font is placed. I have not figured out how to control the placement (margin-top/left/right) of font within an element so I use the <div> element around my font to place it wherever I want. What is a better method?
  18. confused and dazed
    Hello internet. I am using <iframe> (with <button>) to switch between different web pages - embedded in the center - of my home page on my site. Everything seems to be OK until I click the button and then I lose some of my font styles on both the home page and the embedded page iframe brings up. Some things to point out: 1. I am calling an external .css and .js files like this: <link rel="stylesheet" type="text/css" href="/myfile.css"> <script src="myfile.js" type="text/javascript"></script> 2. I set up the <button> like this: <button type="button" class="a1" onclick="changesel1()"><div class="menuc1"><font class="ftag1"><b>Home</b></font></div></button> 3. The <iframe> code looks like this: <iframe id="blocks" frameborder="0" img src="http://www.mysite.com/home.html" style="background-color:black" class="iframe1"> 4. I am calling google font styles like this: <link href='http://fonts.googleapis.com/css?family=Trocchi' rel='stylesheet' type='text/css'> Once I click on the button I lose the font class=”ftag1” font style…. What could be the issues here?
  19. confused and dazed
    I do but I just dont want the "cursor" I would like some other image to appear.... AND I have a highlight css set up on those buttons for hover events
  20. confused and dazed
    Hello internet. I have noticed that when I move my mouse over buttons or <a href> I have created that the pointer turns into a cursor - same cursor you see in Microsoft word. How do I keep this from happening?
  21. confused and dazed
    My current jpg files are 7.8kb this cannot be causing a delay... can it? Is my css code ok? Could it be written more efficiently? .menu1{background: url(menu1.jpg); width:120px; height:36px; Position:absolute; margin-left:0px;}.menu1:hover{background: url(hmenu1_1.jpg);}
  22. confused and dazed
    So in theory the code I used should work in Firefox and Safari?
  23. confused and dazed
    I am expecting to see (in safari) a different image. When the page loads you see menu1.jpg and when you hover over it I want to see hmenu1_1.jpg Basically I have created a "highlight" function of my own. I created an image (menu1) and then in photoshop brightened that image (hmenu1_1). This works in Explorer but not in Safari or Firefox.
  24. confused and dazed
    I will try... Thanks. Maybe it's my css thats causing the issue. See any problems with it? .menu1{background: url(menu1.jpg); width:120px; height:36px; Position:absolute; margin-left:0px;}.menu1:hover{background: url(hmenu1_1.jpg);}
  25. confused and dazed
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> This is the doctype...
×
×
  • Create New...