I am using this template : http://technext.github.io/humanity/
in the Blog News section the Read more button does not work on mobile.the only difference is that in the html code i have add an tag
<div class="button-main bg-fio-point">read more</div>
moreover the image also does not work as a link too on a mobile phone..
Any idea?
Please, make a coherent HTML. Turn the html like this:
<div class="button-main bg-fio-point">read more</div>
Your code is for special cases and for expert layouters. You must to use the normal and valid code like this purpose.
Related
First post here with something that is probably easy but escapes me.
On this site, which I wrote from scratch, the contact link does not jump to the div class "contact".
The site is www.whatyousaycounts.com. I am also open to any other feedback for improvements that you see are needed.
Hyperlinks can only refer to ids, you are trying to refer to a class though. Classes can be used several times, therefore, your link can't target anything.
All you have to do is add the id="contact" to your div and it will work properly.
Each of your other sections have something like:
<div class="videos" id="videos">
Whereas your Contact section is:
<div class="contact">
It needs the id to be set as well.
I am parsing the html from a site and I encountered this tag: <div data-alert class="alert-box success radius">
What attribute does 'data-alert' represent?
These are custom attributes new in HTML 5. See http://www.w3schools.com/tags/att_global_data.asp
Seems like the page you are talking about uses Foundation CSS framework:
http://foundation.zurb.com/docs/components/alert_boxes.html
See this page:
http://foundation.zurb.com/docs/components/alert_boxes.html
It's a div container that, according to the site, conforms to 100% of the container width you put them in.
I need some help here.
I found the "Miniport" template by "html5up" and I want to use this template as a base for my future projetc.
The demo can be seen here: http://html5up.net/miniport
On the demo we can see that bellow the website menu is an circular image and next to it is some texts. I need to know how to remove that image and center the texts so the texts can match the rest of the template (the site has the divs centered too).
I dont have much skills on css nor html5. Im a fan and I want to learn.
If anybode can help me, please..
Sorry about my english.
I too am using this template.
In order to remove the image, open the html document.
Delete this code that is found between ~line 42—46: (this is what formats and holds your image)
<article class="container" id="top">
<div class="row">
<div class="4u">
<span class="image fit"><img src="images/angela.jpg" alt="" width="118%" height="350" /></span>
</div>
Reformat the div tag:
<div class="8u"> to <div class="container" align="center">
By doing this, you are modifying the style within the html document rather than the css doc. This is good since you do not want to change every div tag in the html doc, just this one. Additionally, adding align="center" helps override most css formatting within your divs. You can use that trick later on in your site.
On a side note, double check that you like the command the contact form uses. I do not, since it opens up my computer's email app rather than directly sending the email through the webpage. That's my next project.
Enjoy!
so I have a strange request. I've been working on some security project for school, and I've been able to successfully inject some html code using a form on our test site. What's interesting is that it only accepts the html code as one line and with no spaces. This brings me to my question, so far I've only been able to get text and font color changes to work. But I want to see if someone could inject images/audio/video.
I'm trying to figure out how to turn this:
<img src="http://www.rtur.net/blog/image.axd?picture=2011%2F12%2Fcss.png"/>
Into this:
<imgsrc="http://www.rtur.net/blog/image.axd?picture=2011%2F12%2Fcss.png"/>
but add a space with code.
I've tried adding the but that only works with actualy text and not the tag itself. Any help is appreciated.
Interesting note: I was able to inject <font size="50" color="red"></font>
But I have no idea why that works but the image doesn't.
Have you tried the following?
A slash:
<img\ src="http://www.rtur.net/blog/image.axd?picture=2011%2F12%2Fcss.png"/>
Using a non-traditional closing tag:
<img src="http://www.rtur.net/blog/image.axd?picture=2011%2F12%2Fcss.png"></img>
Injecting a blank <img> tag:
<img src=""/>
Here's another solution: Try inline CSS:
<div style="background:url(http://www.rtur.net/blog/image.axd?picture=2011%2F12%2Fcss.png);height:400px;width:400px"></div>
See this fiddle: http://jsfiddle.net/9MYrM/
hi i am new to html and do not know any php or javascript. I have a simple html webpage with a picture in the middle. I want it so that when you click the picture text appears describing what the picture is but without going to a new webpage. is this possible to do on just html without using javascript or php and if so how is it done? thanks
It's possible to do something similar with the details and summary HTML5 elements.
See this Fiddle (Works only in Chrome/Safari/Opera)
<details>
<summary><img src="image-source"> Click here for more information</summary>
<p>more information</p>
</details>
Due to the lack of browser support, I would not recommend using them. See caniuse.com - summary
You could also use the HTML title tag. The text you wanted to appear would show up on mouseOver on all browsers.
<img src="xxxxxx" title="This is the title" />
Check out on Fiddle